JS-滚动事件和加载事件

6次阅读
没有评论

共计 565 个字符,预计需要花费 2 分钟才能阅读完成。

滚动事件 scroll

当页面进行滚动时触发事件

很多网页需要检测用户把页面滚动到某个区域后做一些处理,比如固定导航栏,比如返回顶部

    // 监听整个页面的滚动
    window.addEventListener('scroll', function () {
        // 执行的操作
    })

windowsdocument 添加 scroll 事件

监听某个元素的内部滚动直接给某个元素添加即可

加载事件 load

加载外部资源(如图标、外联 CSS 和 JavaScript 等)加载完毕时触发的事件<

有些时候需要等页面资源全部处理完了做一些事情

script 写在 head 中,这时候直接找dom元素找不到

    // 监听页面所有的资源加载完毕
    window.addEventListener('load', function () {
        // 执行的操作
    })

不光可以监听整个页面资源加载完毕,也可以针对某个资源绑定 load 事件

加载事件 DOMContentLoaded

当初始HTML文档被完全加载和解析完成之后,DOMContentLoaded 事件被触发,而无需等待样式表、图像等完全加载

    // 监听页面DOM资源加载完毕
    // 给document添加DOMContentLoaded事件
    document.addEventListener('DOMContentLoaded', function () {
        // 执行的操作
    })

正文完
 0
qiaofugui.cn
版权声明:本站原创文章,由 qiaofugui.cn 于2024-05-20发表,共计565字。
转载说明:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(没有评论)
验证码