代码之家 › 专栏 › 技术社区 › David Mason

window.onload似乎在加载DOM之前触发(JavaScript)

onload-event getelementbyid onload javascript-events dom

David Mason · 技术社区 · 16 年前

我在这方面有困难 window.onload document.onload 事件。我读到的每一篇文章都告诉我,在DOM完全加载其所有资源之前,这些都不会触发,似乎我不会这样做:

我在chrome4.1.249.1036(41514)和ie8.0.7600.16385中尝试了以下简单的页面,得到了相同的结果:两个页面都显示消息“It failed!”,表明 myParagraph 未加载(因此DOM似乎不完整)。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <script type="text/javascript">
            window.onload = doThis();
            // document.onload gives the same result

            function doThis() {
                if (document.getElementById("myParagraph")) {
                    alert("It worked!");
                } else {
                    alert("It failed!");
                }
            }
        </script>
    </head>

    <body>
        <p id="myParagraph">Nothing is here.</p>
    </body>
</html>

window.onload文件 将计时器设置为运行半秒 doThis() ,但这似乎是一个不雅观的解决方案,并没有回答为什么的问题

是否有更合适的事件可供使用?

5 回复 | 直到 6 年前

Li0liQ 14 年前

<script type="text/javascript">
    window.onload = function(){
        window.document.body.onload = doThis; // note removed parentheses
    };

    function doThis() {
        if (document.getElementById("myParagraph")) {
            alert("It worked!");
        } else {
            alert("It failed!");
        }
    }
</script>

测试工作在FF/IE/Chrome,虽然考虑处理 document.onload

如前所述,使用js框架将是一个更好的主意。

Darren user513543 14 年前

window.onload = doThis; 而不是 window.onload = doThis();

OverCoder 9 年前

() 是一个 ,就像 + 或 && . () 获取函数并调用它。

所以在这种情况下, doThis () 是调用函数的运算符。 doThis() 合并到一起调用 ,执行它,并计算为的返回值 多蒂斯

window.onload = doThis() 基本上是分配 多蒂斯 到 window.onload

因此,要解决这个问题,需要引用函数本身,而不是调用它。

做 window.onload = doThis

M4N 16 年前

jQuery 而且它是 $(document).ready() 功能:

  $(document).ready(function() {
      // put all your jQuery goodness in here.
  });

Community Mohan Dere 9 年前

这取决于onload函数的位置(head或body标记或更下一步),不同浏览器的内部事件绑定似乎略有不同。

另请参见 window.onload vs document.onload

推荐文章

Adam · JS-typeof不适用于输入|文档。getElementById问题

8 年前

user8652270 · 如何从Cookiebot(外部JavaScript)在cookie横幅中注入(通过JavaScript添加)锚文本和普通文本?

8 年前

MJob · 警报未获取内部HTML?[已关闭]

8 年前

djlowz · 脚本以更改元素。风格DOM中的颜色

8 年前

Zhang · 按ID获取元素的Ember语法无效

8 年前

Nicholas Hamilton · 在Javascript中单击显示各种div

9 年前

M.Koch · Powershell文档。getElementbyID-无法提取正确的信息

9 年前

Peter Series · getElementById(…)意外返回null

10 年前

Brian · Angular 2-为第三方库提供渲染元素

10 年前

Adrian Veidt · 从角度js中的getElementById获取值

10 年前