zoukankan      html  css  js  c++  java
  • JavaScript执行优先顺序

    js在html中的加载执行顺序

    1.加载顺序:引入标记<script />的出现顺序,

    页面上的Javascript代码是HTML文档的一部分,所以Javascript在页面装载时执行的顺序就是其引入标记<script />的出现顺序,
    <script />标记里面的或者通过src引入的外部JS,都是按照其语句出现的顺序执行,而且执行过程是文档装载的一部分。

    <script>
        alert("1-第一个执行"); 
    </script> 
    </head> 
    <body onload="alert('3-最后执行');"> 
    <script>
        alert("2-第二个执行"); 
    </script> 
    

     每个脚本定义的全局变量和函数,都可以被后面执行的脚本所调用。
    变量的调用,必须是前面已经声明,否则获取的变量值是undefined。

    <script type="text/javscrpt">
      alert(str);  
      //输出 undefined 
      var str= 1; 
      alert(str);  //输出 1//
    </script>
    

     同一段脚本,函数定义可以出现在函数调用的后面,但是如果是分别在两段代码,且函数调用在第一段代码中,则会报函数未定义错误。

    <script type="text/javscrpt">
      aa();            //浏览器报错//
    </script>
    <script type="text/javscrpt">//
      aa();   //输出 1 
      function aa()
      {
        alert(1);
      }
    </script
    

     document.write()会把输出写入到脚本文档所在的位置,浏览器解析完documemt.write()所在文档内容后,继续解析document.write()输出的内容,
    然后在继续解析HTML文档。

    <script type="text/javascript">//<![CDATA[    
      document.write('<script type="text/javascript" src="test.js"><//script>');
      document.write('<script type="text/javascript">');    
      document.write('alert(2);')    
      document.write('alert("我是" + tmpStr);');    
      document.write('<//script>');    //]]>
    </script> 
    
    <script type="text/javascript">//<![CDATA[    
      alert(3);    //]]>
    </script>
    
     
    
    test.js的内容是: 
    var tmpStr = 1;    
    alert(tmpStr); 
    

     同名JS函数执行顺序

    <html>
    <head>
    <script  type="text/javascript">
    
        function aa() {
            alert('First aa')
        }   
    </script>   
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
    
    <br />
    <input id="Button1" type="button" value="button"  onclick="aa();"/>
        </form>
    </body>
    <script  type="text/javascript">
        function aa(s) {
            alert('Second aa');
        }
        function aa(s) {
            alert('Last aa');
        }
    </script>
    </html>
    

     点击“botton”执行结果: Last aa

  • 相关阅读:
    简单三步给MM美白
    人物扣图抽出法
    Photoshop用抽出法抠婚纱图技巧实例集合
    十余种漂亮照片边框简单制作技巧
    如何安装knockout 2.0
    色阶去水印法
    PS合成古典的水墨舞者
    在photoshop中,从1寸到24寸的大小是多少
    常用Smarty变量操作符
    discuz代码分析一 从common.inc.php开始
  • 原文地址:https://www.cnblogs.com/LoveOrHate/p/4382278.html
Copyright © 2011-2022 走看看