JS window-onload页面加载完成再执行

    /*
        有时候我们需要将js代码放在html文件任意位置，此时js执行时html元素还未加载，
        就需要 load 使得js文件在所有元素加载完成之后再执行
    */

    
    //1.onload 方式 页面所有元素加载完再加载此内容
    两种写法：

    1.window.onload = function(){}
    2.window.addEventListener('load',function(){});
    
    //实践
    window.addEventListener('load',function () {
            let btn = document.querySelector('button')
            btn.addEventListener('click',function (e) {
                alert("点击我")
            })

    })

    //load 所有内容加载完成才会执行
    
    //2.DOMContentLoaded 只需要dom 的结构加载完成 
    //不需要图片css flash就可以执行 加载速度 > load
    
    document.addEventListener('DOMContentLoaded',function () {
        alert("DOM加载完完成就可，不等图片等其他资源加载完成")
    })