-1

对 JS 来说非常新，只是在玩我从书中写的例子。使用下面的代码 - 为什么我的函数没有被执行？我打电话给他们，语法是正确的。如果我放置 document.addEventListener ("DOMContentLoaded" , init , false) ; 然后 init() 函数将执行，但 test() 函数不执行。

我也对 document.addEventListener 应该正常放置的位置以及它对 init 函数的确切含义感到困惑。是否应该始终首先调用 init() 函数？init() 函数中通常包含什么？

提前致谢。下面的代码；

function init() {
    var panel = document.getElementById("panel");
    panel.innerHTML = "Hello World";
}


function test() {
    var panel = document.getElementById("panel");
    panel.innerHTML = "See ya";

}
init();
test();
4

2 回答 2

3

您可能在加载 DOM 元素之前执行这些函数。页面从上到下阅读。如果函数在读取 HTML 之前执行，则该元素将不存在。

许多开发人员将脚本作为正文中的最后一个元素来避免这种情况。

或者使用 onload 处理程序，像这样

window.onload = function () {
  init();
  test();
}

函数不需要在处理程序中定义

编辑。您正在将数据写入同一个元素也是如此，因此只有第二个函数会有您可以看到的结果。您可以写入单独的元素，或者按照一个答案的建议将数据添加在一起。

于 2013-10-15T16:51:03.060 回答
2

听起来好像正在调用这些方法，但它们会引发错误，因为它们是在 DOM 完成加载之前调用的。在正常情况下，这样的脚本会在浏览器到达它时立即执行，所以如果这发生在加载 DOM 之前（通常是这种情况），对 document.getElementById() 的调用将失败，因为文档没有t 已加载。

您对 document.addEventListener ("DOMContentLoaded" , init , false); 的调用已接近尾声 - 这告诉浏览器在加载 DOM 时调用 init。但是，您只在这种情况下调用 init，因此不会调用 test()。

我建议删除您对 init() 的内联调用；和 test();，然后添加以下内容：

function onLoaded(){
    init();
    test();
}

然后从您的事件侦听器调用 onLoaded：

document.addEventListener ("DOMContentLoaded" , onLoaded , false);
于 2013-10-15T16:52:47.183 回答