gpt4 book ai didi

javascript - head 中的 Javascript 如何访问 body 中的元素?

转载 作者:行者123 更新时间:2023-12-02 19:48:11 25 4
gpt4 key购买 nike

我经常看到一些在 html 页面的 head 标签中调用的 JavaScript 库。但是,如果这些库调用 body 标记中的元素,则会有响应(仍然来自 head 标记)。当我尝试从头部调用一个元素时,没有响应 - 为什么?

提前致谢。 :)

最佳答案

浏览器从上到下解析html页面,执行任意<script>当它找到它们时就将其固定到位。这意味着如果 JavaScript 尝试访问页面上的元素,它只能看到页面中较高位置的元素,因为较低位置的元素尚未被解析。

有两种方法可以解决这个问题:

  1. 输入您的<script> block 在底部,就在收盘前 </body>标签(或者至少将其放在需要引用的元素之后),和/或

  2. 使用onload (或者,如果您喜欢 jQuery,则使用 $(document).ready() )处理程序。

设置 onload 的一种方法处理程序是这样的:

<head>
<script>
window.onload = function() {
// this function will be called by the browser after
// the entire page has loaded and thus code in the function
// can access any element on the page.
};
</script>
</head>
<body>
... various elements ...
</body>

您可能还见过这样的东西:

<body onload="someFunction();">

哪里someFunction()可以在 <script> 中定义阻止在 <head> 。基本上是一样的事情,但是使用 html 中的属性来做这件事已经是 20 世纪 90 年代的事情了。 (实际上,甚至 window.onload() 现在已经过时了,但它有效,我没有时间解释 .addEventListener() method 。)

关于javascript - head 中的 Javascript 如何访问 body 中的元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9645345/

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