Вставить/удалить содержимое HTML между тегами div

Question

как я могу вставить код HTML между <div id="mydiv">...</div> с помощью javascript?

Ex: <div id="mydiv"><span class="prego">Something</span></div> его около 10 строк html большинства. спасибо

Answer 1

Если вы заменяете содержимое DIV и иметь HTML в виде строки, вы можете использовать следующее:

document.getElementById('mydiv').innerHTML = '<span class="prego">Something</span>'; 

Answer 2

// Build it using this variable 
var content = "<span class='prego'>....content....</span>"; 
// Insert using this: 
document.getElementById('mydiv').innerHTML = content; 

Answer 3

document.getElementById("mydiv").innerHTML = "<span class='prego'>Something</span>"; 

должны это сделать. Если вы хотите использовать jQuery, это может быть проще.

Answer 4

document.getElementById ('mydiv'). InnerHTML = 'whatever';

Answer 5

Это действительно неоднозначный запрос. Есть много способов сделать это.

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); 

Preferred для обоих этих методов было бы использовать библиотеку Javascript, который создает сокращенные методы для простых вещей, как это, например, MooTools. (http://mootools.net)

С MooTools эта задача будет выглядеть так:

new Element('span', {'html': 'Something','class':'prego'}).inject($('mydiv')); 

Answer 6

Простой способ сделать это с ванилью 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>");