gpt4 book ai didi

javascript - 在 HTML 超链接标记的 onClick 中调用 JavaScript 函数 ping() 导致 TypeError

转载 作者:搜寻专家 更新时间:2023-10-31 08:45:50 26 4
gpt4 key购买 nike

我今天偶然发现了这个,因为我不是浏览器专家或网络开发人员,所以我可能错过了一些相当明显的东西。观察下面的简单 HTML:

<html>
<head>
<script>
function ping() {
console.log('pong');
}
</script>
</head>
<body>
<a href="#" onClick="ping()">Call ping</a>
</body>
</html>

单击链接时我期望的是在控制台中打印 pong。但是,我在 Chrome 和 Firefox 中得到的是“TypeError: ping is not a function”。如果我直接从控制台调用该函数,它就可以工作。如果我将 ping 函数重命名为其他名称,它就可以工作。如果我将“a”标签替换为“button”标签,同时保留名为 ping 的函数,它就可以工作了!

似乎以某种方式,仅在这种特定组合中:使用名为 ping() 的函数单击标记“a”会导致上述错误。我是疯了还是我只是发现了世界上最微不足道的错误?如果它是一个错误,我觉得它发生在 Chrome 和 Firefox 中很奇怪,因为它们有不同的 JavaScript 引擎实现,不同的布局引擎实现等等。

最佳答案

Some tests我确实展示了内联事件处理程序可以直接通过名称访问元素的属性。因此,如果您的函数匹配任何有效的属性名称(并且 ping seems to be HTML5 中的有效属性),就会发生这种情况。

因此,您的代码被解释为尝试对 ""(ping 的值)发出函数调用,但失败了。这只会发生在内联事件处理程序中,如果您使用 element.onclick=function(){...addEventListener 则不会,因此如果您使用一个,则可以避免该问题这些方法的一部分(无论如何都推荐使用它们,因为内联处理程序违反了 separation of concerns 的原则)。

关于javascript - 在 HTML 超链接标记的 onClick 中调用 JavaScript 函数 ping() 导致 TypeError,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19452230/

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