使用JavaScript更改div的内容

Question

如何使用JavaScript动态更改div的内容？

Answer 1

这应该这样做：

<div id="foo">Div you want to change</div>

在JavaScript中：

document.getElementById('foo').innerHTML = 'Your content';

Answer 2

document.getElementById("divId").innerHTML = "new content!"

我建议使用类似jQuery的框架，因为你可能会在以后做更多这样的事情。

Answer 3

值得注意的是，您还可以使用 innerHTML 来包含其他标记。此外，如果DIV没有ID，您可以尝试使用 getElementsByTagName 。

示例，获取文档中的第一个DIV：

document.getElementsByTagName("div")[0].innerHTML = "<p>This is a <span>new</span> paragraph</p>";

这允许您循环文档中的多个DIV并检查其他条件。

就像他们上面所说的那样，如果DIV有一个你知道会永远存在的ID，那就更好用了：

document.getElementById("theID").innerHTML = "<p>This is a <span>new</span> paragraph</p>";

查看原型（下面的链接）（或jQuery）来处理它，因为它们可以让生活更轻松，特别是当你进入CSS选择器时：

• http://api.prototypejs.org/dom/dollar.html
• http://api.prototypejs.org/dom/dollardollar.html
• http://api.prototypejs.org/dom/element.html#select-class_method

Answer 4

$(document).ready(function(){

$('#btn').click(function(){   

    $('#div_content').load('html.page');

 });
});