zoukankan      html  css  js  c++  java
  • 当document.write 遇到外联script

    先来看个例子:

    <!DOCTYPE html>
    <html>
    <head>
        <title>测试 document.write</title>
        <meta charset="utf-8">
        <script type="text/javascript">
        document.write('<script type="text/javascript" src="js/getnum.js"></script>');
        document.write('<script type="text/javascript" src="js/jquery-1.3.2.js"></script>');
        </script>
    </head>
    <body>
    test document.write
    </body>
    </html>
    //getnum.js
    
    var nodes=document.getElementsByTagName('script');
    alert(nodes.length);
    //IE 3
    //Chrome Firefox 2

    运行结果为什么Chrome和Firefox的结果为2而IE为3呢?

    在IE中,当document.write创建了一个外联的script标签后,外联js里面的代码不会立即被执行,而是等到document.write所在的script标签中的代码全部运行完了,才开始执行。所以在这个例子中,IE要等到第二个script标签页创建好才执行getnum.js中的代码。

    而在Chrome和Firefox中,它们是在document.write创建script标签立即执行该js中的内容,执行完后再继续执行下一条document.write

    运用场景:参看司徒大神的javascript框架设计一书(第19页),例子稍微改了下= =。

    <!DOCTYPE html>
    <html>
    <head>
        <title>测试 readyState</title>
        <meta charset="utf-8">
        <script type="text/javascript">
        document.write('<script type="text/javascript" src="js/geturl.js"></script>');
        document.write('<script type="text/javascript" src="js/jquery-1.3.2.js"></script>');
        </script>
    </head>
    <body>
    test readyState
    </body>
    </html>
    var nodes=document.getElementsByTagName('script');
    if(window.VBArray){//如果是IE浏览器
        for(var i=0,node;node=nodes[i++];){//注意这里,for循环的判断条件永远为真,所以它是个死循环,好在循环体中有break语句可以跳出循环。
            if(node.readyState==="interactive"){
                break;
            }
        }
           //这样也可以
          /*
        var i=0;
        while(node=nodes[i++]){
            if(node.readyState==="interactive"){
                break;
            }
        }
         */
    
    }else{
        node=nodes[nodes.length-1];
    }
    
    //test
    alert(node.src);
    // file:///D:/wamp/www/test/js/geturl.js     

    最新的mass.js中没有找到这个getBashPath方法,大概是在13年的版本?

  • 相关阅读:
    机器学习(深度学习)
    机器学习(六)
    机器学习一-三
    Leetcode 90. 子集 II dfs
    Leetcode 83. 删除排序链表中的重复元素 链表操作
    《算法竞赛进阶指南》 第二章 Acwing 139. 回文子串的最大长度
    LeetCode 80. 删除有序数组中的重复项 II 双指针
    LeetCode 86 分割链表
    《算法竞赛进阶指南》 第二章 Acwing 138. 兔子与兔子 哈希
    《算法竞赛进阶指南》 第二章 Acwing 137. 雪花雪花雪花 哈希
  • 原文地址:https://www.cnblogs.com/qianlegeqian/p/3983227.html
Copyright © 2011-2022 走看看