时间戳

首页 > 解决方案 > 为什么有些变量没有定义？

javascript - 为什么有些变量没有定义？

问题描述

我对 javascript 提出这个问题感到很陌生，并且在这里完全被难住了。不知道为什么并试图弄清楚很多小时，但是如果，例如，我的脚本中有这一行：

var listen = document.getElementsByClassName('test_this')[0];

在我的本地机器上，当我在控制台中输入“listen”时，它会返回 undefined，但是如果我在控制台中手动输入它，那么它就可以工作。例如：

的HTML：

<p class='test_this'>hi</p>

JS：

var listen = document.getElementsByClassName('test_this')[0];

listen.addEventListener("click", function onclick(event) {
  alert('hi');
});

function testZis() {
  alert('test worked');
}
alert('saysHiAnyway');

Codepen 网址：https ://codepen.io/anon/pen/pqZNVR

如果我加载 codePen URL，我会收到正确的警报，但在我的浏览器中的本地计算机上，我只会收到此错误：Cannot read property 'addEventListener' of undefined并且没有警报 - 大概是因为出于某种未知原因，var listen 声明行不起作用。

有人可以解释这里到底发生了什么吗？我会非常感激。我有一种感觉，它非常简单，但似乎很难识别。谢谢你的帮助。

标签： javascriptjqueryhtmlfunction

解决方案

您有几个选项可以解决此问题：

将您的<script>标签放在所有 HTML 代码的下方，即结束</body>标签的正上方。

另一种方法是将所有代码包装在一个window.onload事件处理程序中，如下所示：

window.onload = function() {
    //All of your code goes here
}

推荐阅读