在div标签之间插入/删除HTML内容

Question

如何使用javascript在<div id="mydiv">...</div>之间插入一些HTML代码？

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

使用vanilla 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>");

Answer 3

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

Answer 4

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

应该这样做。如果你愿意使用jQuery，那就更容易了。

Answer 5

document.getElementById（'mydiv'）。innerHTML ='whatever';

Answer 6

这真是一种含糊不清的要求。有很多方法可以实现。

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

这是最简单的。 OR;

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

Answer 7

JavaScript

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

jQuery

$("#mydiv").append('<span class="prego">Something</span>');