вставьте/удалите содержимое HTML между тегами Div
Два трюка . В основном, инвертирование HTML-кода ваших желаемых элементов в HTML и использование ~ Операторы следующего сиблинга :
float-right + инвертируют порядок HTML элементы
div{ /* Do with the parent whatever you know just to make the
inner float-right elements appear where desired */
display:inline-block;
}
span{
float:right; /* float-right the elements! */
}
span:hover ~ span{ /* On hover target it's "previous";) elements */
background:red;
} <div>
<!-- Reverse the order of inner elements -->
<span>5</span>
<span>4</span>
<span>3</span>
<span>2</span>
<span>1</span>
</div> Родитель с direction: rtl; + инвертирует порядок внутренних элементов
.inverse{
direction: rtl;
display: inline-block; /* inline-block to keep parent at the left of window */
}
span:hover ~ span{ /* On hover target it's "previous";) elements */
background:gold;
}Hover one span and see the previous elements being targeted!<br>
<div class="inverse">
<!-- Reverse the order of inner elements -->
<span>5</span>
<span>4</span>
<span>3</span>
<span>2</span>
<span>1</span>
</div>7 ответов
Если вы заменяете содержимое div и используете HTML в виде строки, вы можете использовать следующее:
document.getElementById('mydiv').innerHTML = '<span class="prego">Something</span>';
Javascript
document.getElementById('mydiv').innerHTML = '<span class="prego">Something</span>';
jQuery
$("#mydiv").append('<span class="prego">Something</span>');
// Build it using this variable
var content = "<span class='prego'>....content....</span>";
// Insert using this:
document.getElementById('mydiv').innerHTML = content;
document.getElementById("mydiv").innerHTML = "<span class='prego'>Something</span>";
Должен сделать это. Если вы хотите использовать jQuery, это может быть проще.
Простой способ сделать это с помощью ванильного JavaScript - использовать appendChild .
var mydiv = document.getElementById("mydiv");
var mycontent = document.createElement("p");
mycontent.appendChild(document.createTextNode("This is a paragraph"));
mydiv.appendChild(mycontent);
Или вы можете использовать innerHTML , как уже упоминалось другими.
Или, если вы хотите использовать jQuery, приведенный выше пример можно записать как:
$("#mydiv").append("<p>This is a paragraph</p>");
document.getElementById ('mydiv' ) .innerHTML = 'что угодно';
Это действительно неоднозначный запрос. Это можно сделать разными способами.
document.getElementById('mydiv').innerHTML = '<span class="prego">Something</span>';
Это самый простой . ИЛИ;
var spn = document.createElement('span');
spn.innerHTML = 'Something';
spn.className = 'prego';
document.getElementById('mydiv').appendChild(spn);
Для обоих этих методов предпочтительнее было бы использовать библиотеку Javascript, которая создает методы быстрого доступа для таких простых вещей, как это, например, mootools. ( http://mootools.net )
С mootools эта задача будет выглядеть так:
new Element('span', {'html': 'Something','class':'prego'}).inject($('mydiv'));