Question

HTML文件......

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="src/myJS.js"></script>
</head>
<body onload="myJS.myFunction();">
<p id="p01"></p>
</body>
</html>

外部Javascript文件（为方便起见，称为myJS.js）......

myJS = {
    myFunction: function()
    {
        //This works
        document.write("Hello world. ");

        //This does not work
        document.getElementById("p01").appendChild(document.createTextNode("Hello world, again"));
    }
};

我最好的猜测是，在执行p01时尚未创建节点myJS，但我认为onload会使用它做正确的事情。

Answer 1

如果您的外部js确实包含您发布的两行代码，则问题是document.write正在覆盖整个HTML（一旦加载DOM就会表现得像这样）。然后getElementById将找不到任何#p01，因为它将不再存在。

如果您只是删除了document.write来电，那么您的代码应该有效（请参阅live example）。

Answer 2

因为p01尚未添加到DOM中。

试试这样：

<body>
<p id="p01"></p>
<script type="text/javascript">
window.onload = myJS.myFunction;
</script>
</body>

getElementById和onLoad

2 个答案: