gpt4 book ai didi

javascript - 属性 onclick 为 null

转载 作者:行者123 更新时间:2023-12-03 07:34:09 25 4
gpt4 key购买 nike

您好,我尝试过,收到错误“Uncaught TypeError: Cannot set property 'onclick' of null”

  • 将“window.onload”包裹在我的代码中
  • 将 html 中的脚本链接移动到页面顶部和底部

我在网上没有找到任何其他解决方案,

这是我的 HTML

<!DOCTYPE html>
<html>
<head>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,700,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
</head>
<body>
<div class="Contact">
Contact
<a class="a3">
<i class="fa fa-chevron-up"></i>
</a>
</div>
<script src = "Script.js"></script>
</body>
</html>

这是我的 JS

var arrowThree = document.getElementById("a3");

arrowThree.onclick = function(){
alert("You clicked on Contact");
};

当然,我的 JS 和 css 文件还有更多内容,但这对问题并不重要

最佳答案

当没有具有该 ID 的元素时,您正在使用 getElementById。为此,您需要向元素添加一个 id:

<a id="a3" class="a3">

或者,通过类名获取:

var arrowThree = document.getElementsByClassName("a3")[0];

但是,通过类名获取将返回一个数组 - 请注意这一点。在我的示例中,我得到了第一个包含您正在查找的类的元素,但这可能并不总是正确的。

如果页面上有多个具有该类的元素,您无法保证您拥有正确的元素。如果您想将 onClick 添加到所有这些元素,则此方法更适合,如下所示:

var arrowThrees = document.getElementByClassName("a3");
var clickHandler = function(){
alert("You clicked on Contact");
}

for (var i=0; i<arrowThrees.length; i++) {
arrowThrees[i].onclick = clickHandler;
}

您选择哪种方法取决于您是希望所有这些元素都具有 onClick 还是仅一个。

关于javascript - 属性 onclick 为 null,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35688832/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com