基本JavaScript事件监听器不工作？_Javascript

基本JavaScript事件监听器不工作？

javascript

基本JavaScript事件监听器不工作？,javascript,Javascript,我正在努力学习JavaScript的基础知识我不明白为什么这不起作用…它这么基本 <html> <head> <meta charset="utf-8" /> <style type="text/css"> ul{ list-style-type:none; } div{ width:300px; height:200px; background-color:

我正在努力学习JavaScript的基础知识我不明白为什么这不起作用…它这么基本

<html>
<head>
<meta charset="utf-8" />
<style type="text/css">
    ul{
        list-style-type:none;
    }
    div{
        width:300px;
        height:200px;
        background-color:#0066cc;
    }
</style>

<script language="text/javascript"> 
    var testing = document.getElementById("addBtn");
    testing.addEventListener("click", function(e){ alert("test") } , false);
</script>

</head>
<body>
<ul id="placeholder"></ul>
<a href="#" id="addBtn">Add</a>
</body>
</html>


保险商实验室{
列表样式类型：无；
}
div{
宽度：300px；
高度：200px；
背景色：#0066cc；
}
var测试=document.getElementById（“addBtn”）；
testing.addEventListener（“单击”，函数（e）{alert（“test”）}，false）；

尝试访问时未加载

添加BTN

。加载DOM后，应通过将代码移动到文件底部或通过

onload

事件执行该操作：

window.onload = function() {
    var testing = document.getElementById("addBtn");
    testing.addEventListener("click", function(e){ alert("test") } , false);
}

当您尝试访问时，

addBtn

未加载。加载DOM后，应通过将代码移动到文件底部或通过

onload

事件执行该操作：

window.onload = function() {
    var testing = document.getElementById("addBtn");
    testing.addEventListener("click", function(e){ alert("test") } , false);
}

当代码：

var testing = document.getElementById("addBtn");

运行时，

addBtn

元素尚未解析。您可以做的一件事是将

标记向下移动到页面底部

您可以做的另一件事是在onload事件中运行代码。比如：

<script language="text/javascript">
   window.onload = function () {
      var testing = document.getElementById("addBtn");
       testing.addEventListener("click", function(e){ alert("test") } , false);
   };
</script>


window.onload=函数（）{
var测试=document.getElementById（“addBtn”）；
testing.addEventListener（“单击”，函数（e）{alert（“test”）}，false）；
};

当代码：

var testing = document.getElementById("addBtn");

运行时，

addBtn

元素尚未解析。您可以做的一件事是将

标记向下移动到页面底部

您可以做的另一件事是在onload事件中运行代码。比如：

<script language="text/javascript">
   window.onload = function () {
      var testing = document.getElementById("addBtn");
       testing.addEventListener("click", function(e){ alert("test") } , false);
   };
</script>


window.onload=函数（）{
var测试=document.getElementById（“addBtn”）；
testing.addEventListener（“单击”，函数（e）{alert（“test”）}，false）；
};
< /代码> 除了使用<代码>窗口.OnLoad （这是问题的关键答案），考虑使用<代码> <代码>或<代码> <代码>，因为“语言”属性被弃用。除了使用<代码>窗口.OnLoad （这是问题的关键答案），考虑使用<代码> <代码>或<代码> <代码>，因为“语言”属性被弃用。p> 如果你跳过基本的Javascript，转而学习jQuery，这会容易得多。@PaulTomblin可能。但这也是一个可怕的建议，你想知道自己到底在做什么@PaulTomblin“我正在尝试学习JavaScript的基础知识”，所以我不这么认为…@AlexWayne，我在幻灯片中没有看到任何东西说明为什么你不应该学习jQuery，只有那些差劲的程序员编写差劲的代码，不管他们使用什么工具。@PaulTomblin这篇演讲的寓意是学习JavaScript，然后将jQuery作为工具箱中众多工具之一学习。而不仅仅是学习jQuery。jQuery应该被视为一个javascript库，而不是一种完整的语言。如果没有Java，就无法学习Struts，如果没有Ruby，就无法学习Rails，如果没有Objective，就无法学习UIKit。没有JavaScript你不应该学习jQuery。如果你跳过基本的JavaScript而学习jQuery，这会容易得多。@PaulTomblin可能吧。但这也是一个可怕的建议，你想知道自己到底在做什么@PaulTomblin“我正在尝试学习JavaScript的基础知识”，所以我不这么认为…@AlexWayne，我在幻灯片中没有看到任何东西说明为什么你不应该学习jQuery，只有那些差劲的程序员编写差劲的代码，不管他们使用什么工具。@PaulTomblin这篇演讲的寓意是学习JavaScript，然后将jQuery作为工具箱中众多工具之一学习。而不仅仅是学习jQuery。jQuery应该被视为一个javascript库，而不是一种完整的语言。如果没有Java，就无法学习Struts，如果没有Ruby，就无法学习Rails，如果没有Objective，就无法学习UIKit。如果没有JavaScript，就不应该学习jQuery。