• 异步加载 js


    1、defer,只支持IE 

    defer属性的定义和用法(我摘自w3school网站) defer 属性规定是否对脚本执行进行延迟,直到页面加载为止。有的 javascript 脚本 document.write 方法来创建当前的文档内容,其他脚本就不一定是了。 如果您的脚本不会改变文档的内容,可将 defer 属性加入到<script> 标签中,以便加快处理文档的速度。

    因为浏览器知道它将能够安全地读取文档的剩余部分而不用执行脚本,它将推迟对脚本的解释,直到文档已经显示给用户为止。 

    示例:

    <script type="text/javascript" defer="defer"> 
        alert(document.getElementById("p1").firstChild.nodeValue); 
    </script>

    2、async:

    async的定义和用法(是HTML5的属性)async 属性规定一旦脚本可用,则会异步执行。

    示例:

    <script type="text/javascript" src="demo_async.js" async="async"></script>

    注释:async 属性仅适用于外部脚本(只有在使用 src 属性时)。

    注释:有多种执行外部脚本的方法: 

        如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行) 

        如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行 

        如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本 

    3、创建script,插入到DOM中,加载完毕后callBack

    代码:

    function loadScript(url, callback){ 
        var script = document.createElement_x("script") 
        script.type = "text/javascript"; 
        if (script.readyState){ //IE 
            script.onreadystatechange = function(){ 
                if (script.readyState == "loaded" || script.readyState == "complete"){ 
                    script.onreadystatechange = null; 
                    callback(); 
                }}; 
        }else{
            //Others: Firefox, Safari, Chrome, and Opera 
            script.onload = function(){ 
                callback(); 
            }; 
        } 
        script.src = url; 
        document.body.appendChild(script); 
    }
  • 相关阅读:
    python:封装连接数据库方法
    Python:self理解
    python:pytest优秀博客
    python:pytest中的setup和teardown
    python:单元测试框架pytest的一个简单例子
    java中的static关键字解析
    浅谈Java中的final关键字
    SpringMVC+Spring+Mybatis框架集成
    Mybatis学习总结(四)——输入映射和输出映射
    Mybatis学习总结(三)——SqlMapConfig.xml全局配置文件解析
  • 原文地址:https://www.cnblogs.com/wzzl/p/5128759.html
Copyright © 2020-2023  润新知