JavaScript—页面加载及调整窗口大小

KolaDecember.

于 2022-05-18 10:00:01 发布

阅读量1.9k

点赞数

分类专栏：前端学习笔记文章标签： js javascript

本文链接：https://blog.csdn.net/m0_59715238/article/details/124836144

版权

本文探讨JavaScript中页面加载的两个关键事件：'load'和'DOMContentLoaded'，以及如何监听窗口大小调整。'load'事件等待所有资源（如DOM、图片、CSS等）完全加载，而'DOMContentLoaded'事件仅在DOM结构构建完成后触发，不包括资源。此外，还讲解了窗口大小改变的处理方法。

摘要由CSDN通过智能技术生成

1.页面加载

load

load等页面内容全部加载完毕包括页面DOM元素、图片、css、flash等等

DOMContentLoaded

DOMContentLoaded 是DOM加载完毕，不包含图片 flash css 等就可以执行加载速度比load快一点

<script>
        window.addEventListener('load',function(){
            var btn=document.querySelector('button');
            btn.addEventListener('click',function(){
                alert('点击我');
            })
        })
        //load等页面内容全部加载完毕包括页面DOM元素、图片、css、flash等等
        //DOMContentLoaded 是DOM加载完毕，不包含图片 flash css 等就可以执行 加载速度比load快一点
        window.addEventListener('load',function(){
            alert('ww');
        })
        window.addEventListener('DOMContentLoaded',function(){
            alert(11);
        })
    </script><