Pro Javascript 的代码无法运行

Code for Pro Javascript won't running

本文关键字：运行 代码 Javascript Pro      更新时间：2023-09-26

我认为这里不是正确的词。 我不能让它运行。

这是一段非常简单的代码。 如果我只是输入alert("Working");它运行良好。

无论如何，这是整个代码，也许你们可以帮助我弄清楚我做错了什么。

<!DOCTYPE html>
<html>
<head>
    <title>Events</title>
</head>
<body>
<script type="text/javascript">
    var btn = document.getElementById("btn");
    btn.attachEvent("onclick", function(){
        alert("Clicked");
    })
</script>
<input id="btn" type="button" value="Press me">
</body>
</html>

几个问题：

  1. 在加载文档之前，您的代码无法运行。 如果运行得太快，它将无法在页面中找到对象。 最简单的方法是将代码块移动到 </body> 标记的正前方。
  2. attachEvent()仅适用于旧版本的 IE。 所有现代浏览器都支持 .addEventListener() .

修订后的网页/代码：

<!DOCTYPE html>
<html>
<head>
    <title>Events</title>
</head>
<body>
<input id="btn" type="button" value="Press me">
<script type="text/javascript">
    var btn = document.getElementById("btn");
    btn.addEventListener("click", function(){
        alert("Clicked");
    })
</script>
</body>
</html>

工作演示：http://jsfiddle.net/jfriend00/Dmqdn/

要在FF（和其他现代浏览器）上工作：

document.addEventListener("DOMContentLoaded", function(event) {
    var btn = document.getElementById('btn');
    btn.addEventListener('click', function() {
        console.log('Clicked');
    });
});

在尝试访问 DOM 之前，确保完全加载它是最安全的。

我用过console.log，你应该熟悉它，它会对你有很大帮助。查看 FireBug for FF，Chrome 中的开发工具。

这是说明解决方案的 jsfiddle。您需要做两件事才能完成此操作：

  1. 将<script>标记移动到输入下方
  2. 将attachEvent替换为 addEventListener 。 不再支持 attachEvent

代码如下：

<input id="btn" type="button" value="Press me">
<script type="text/javascript">
    var btn = document.getElementById("btn");
    btn.addEventListener("click", function(){
        alert("Clicked");
    })
</script>
相关文章：