javascript innerhtml不会更改源代码上的内容

Question

我不知道如何解决这个问题.我想在某些事件上更改(DOM)源代码,如下所示:

脚本:

<script type="text/javascript">
function ChangeText(){
     document.getElementById("p1").innerHTML="New text!";
}
</script>

HTML:

<p id="p1">Hello world!</p>
<input type="button" onclick="ChangeText()" value="Change text" />

好吧,当我点击按钮时这很好用.但是当我查看源代码时,它仍然看起来像这样:

<html>
    <body>
        <p id="p1">Hello world!</p>
        <input type="button" onclick="ChangeText()" value="Change text" />
    </body>
</html>

代替:

<html>
    <body>
        <p id="p1">New text!</p>
        <input type="button" onclick="ChangeText()" value="Change text" />
    </body>
</html>

Answer 1

您的源代码不会更改.

只是DOM

因此,如果您使用的是firebug或chrome,则可以使用inspect元素查看更改.

看到这里:http://jsfiddle.net/maniator/eVw7Y/(这是用你的例子)

查看Firebug Lite:http://getfirebug.com/firebuglite - 它允许您在任何浏览器中使用缩小版的Firebug(包括IE) (3认同)