问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

什么时候用window.onload?

头像
Edison_C
    8111

    网上说在head里写JavaScript需要加window.onload,自己试着写了两段代码，结果代码2提示错误，删了window.onlad却能执行了，迷糊了。求解原因，及什么时候用window.onload

    代码1：

    <script type="text/javascript">
    window.onload=function(){
    document.getElementById("button1").addEventListener("click", function()
    {
        if (document.getElementById("allmap").style.display == "block") {

        document.getElementById("allmap").style.display = "none";
    } else {
       document.getElementById("allmap").style.display = "block";

    }
    });            
    }
</script>

    代码2：

    <script type="text/javascript">
    window.onload=function(){
        function clickButton(){
            document.getElementById('btn').click();
        }
        function alertMsg(){
            alert(btn.value);
        }
    }
</script>
    javascript
    阅读 18.4k
    7 个回答
    得票最新
    头像
    u3u
      5.5k31224

      基本不用 onload 一般将 script 标签放到 </body> 之前
      这么做有两个好处：
      1.不需要写 onload 因为在此时所有 DOM 元素已经初始化完毕
      2.优先加载样式和 HTML 结构 防止脚本加载慢时导致页面显示空白

      头像
      lghuahua
        3371512
        头像
        sunshineltt
          64414

          window.onload是页面加载完成之后才执行里边的函数，你如果是放在要执行文本 的上边，必须写，如果你是放在要执行的文本 或者body标签下的话，就不需要window.onload

          头像
          cookygg
            63

            DOM加载完成后需要运行的js代码需要加window.onload,或者加到</body>之前.

            头像
            samcello
              22814

              下面这段不会报错,因为function执行的时候, element "god"已经存在了.
              <!DOCTYPE html>
              <html>
              <head>

              <script type="text/javascript">
window.onload= function (){
    var god = document.getElementById('god');
    god.innerHTML="say something!";
}
</script>

              </head>
              <body>
              <div id="god"></div>
              </body>
              </html>

              下面就会报错, 因为这段js在head里,执行时 element "god" 还没创建.

              <!DOCTYPE html>
              <html>
              <head>

              <script type="text/javascript">
    var god = document.getElementById('god');
    god.innerHTML="say something!";
</script>

              </head>
              <body>
              <div id="god"></div>
              </body>
              </html>

              可以把上面的代码放在html尾部,就不会报错了.

              但是一般不这么做,

              一般可以把这段js放在一个js文件里,用script标签引入进来,用defer关键字来延迟加载.

              头像
              prototype_eva
                1.1k23557

                代码能不能貼全，错误都不能还原都在那瞎猜浪费时间，与其说加载顺序问题，我比较关注它的js写得有问题，例如这句document.getElementById('btn').click();感觉好像是没写完，还有.click()好像是jquery方法

                头像
                天下布武
                  22
                  新手上路，请多包涵

                  火狐浏览器(Firefox)下head标签里面window.onload （采用匿名方法）事件不执行

                  撰写回答
                  你尚未登录，登录后可以
                  • 和开发者交流问题的细节
                  • 关注并接收问题和回答的更新提醒
                  • 参与内容的编辑和改进，让解决方法与时俱进
                  推荐问题