亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb

首頁 > 編程 > JavaScript > 正文

Javascript在頁面加載時的執行順序【轉】

2019-11-14 16:36:17
字體:
來源:轉載
供稿:網友

一、在HTML中嵌入javasript的方法

  1. 直接在Javascript代碼放在標記對<script>和</script>之間
  2. 由<script />標記的src屬性制定外部的js文件
  3. 放在事件處理程序中,比如:<p onclick="alert('我是由onclick事件執行的Javascript')">點擊我</p>
  4. 作為URL的主體,這個URL使用特殊的Javascript:協議,比如:<a href="javascript:alert('我是由javascript:協議執行的javascript')">點擊我</a>
  5. 利用javascript本身的document.write()方法寫入新的javascript代碼
  6. 利用Ajax異步獲取javascript代碼,然后執行

 

第3種和第4種方法寫入的Javascript需要觸發才能執行,所以除非特別設置,否則頁面加載時不會執行。

二、Javascript在頁面的執行順序

  1. 頁面上的Javascript代碼是HTML文檔的一部分,所以Javascript在頁面裝載時執行的順序就是其引入標記<script />的出現順序, <script />標記里面的或者通過src引入的外部JS,都是按照其語句出現的順序執行,而且執行過程是文檔裝載的一部分。(按我自己的習慣,一般把引入外部JS的script標簽放在</body>之前,但若在javascript代碼中設置文檔的CSS,則將script標簽放在文檔核心內容之前,以便在文檔顯示的時候就已經有渲染,避免頁面閃爍。)
  2. 每個腳本定義的全局變量和函數,都可以被后面執行的腳本所調用。
  3. 變量的調用,必須是前面已經聲明,否則獲取的變量值是undefined。
    <script type="text/javscrpt">//<![CDATA[alert(tmp);  //輸出 undefinedvar tmp = 1;alert(tmp);  //輸出 1//]]></script>
  4. 同一段腳本,函數定義可以出現在函數調用的后面,但是如果是分別在兩段代碼,且函數調用在第一段代碼中,則會報函數未定義錯誤。
    <script type="text/javscrpt">//<![CDATA[aa();            //瀏覽器報錯//]]></script><script type="text/javscrpt">//<![CDATA[aa();			//輸出 1 function aa(){alert(1);}//]]></script>
  5. 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);
    • FirefoxOpera中的彈出值的順序是:1、2、我是1、3
    • 在IE中彈出值的順序是:2、1、3,同時瀏覽器報錯:tmpStr未定義

    原因可能是IE在document.write時,并未等待加載SRC中的Javascript代碼完畢后,才執行下一行,所以導致2先彈出,并且執行到document.write(‘document.write("我是" + tmpStr)’)調用tmpStr時,tmpStr并未定義,從而報錯。

    解決這個問題,可以利用HTML解析是解析完一個HTML標簽,再執行下一個的原理,把代碼拆分來實現:

    <script type="text/javascript">//<![CDATA[    document.write('<script type="text/javascript" src="test.js"><//script>');    //]]></script>  <script type="text/javascript">//<![CDATA[    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>

    這樣IE下和其他瀏覽器輸出值的順序都是一直的了:1、2、我是1、3。

三、如何改變Javascript在頁面的執行順序

    1. 利用onload
      <script type="text/javascript">//<![CDATA[window.onload = f;function f(){alert(1);}alert(2);//]]></script>

      輸出值順序是 2、1。

      需要注意的是,如果存在多個winodws.onload的話,只有最有一個生效,解決這個辦法是:

      window.onload = function(){f();f1();f2();.....}

      利用2級DOM事件類型

      if(document.addEventListener){window.addEventListener('load',f,false);window.addEventListener('load',f1,false);...}else{window.attachEvent('onload',f);window.attachEvent('onload',f1);...}
    2. IE中可以利用defer,defer作用是把代碼加載下來,并不立即執行,等文檔裝載完畢之后再執行,有點類似window.onload,但是沒有window.onload那樣的局限性,可以重復使用,但是只在IE中有效,所以上面的例子可以修改成為
      <script type="text/javascript">//<![CDATA[document.write('<script type="text/javascript" src="test.js"><//script>');document.write('<script type="text/javascript" defer="defer">');document.write('alert(2);')document.write('alert("我是" + tmpStr);');document.write('<//script>');//]]></script><script type="text/javascript">//<![CDATA[alert(3);//]]></script>

      這樣IE就不報錯了,輸出值的順序變成:1、3、2、我是1

      當HTML解析器遇到一個腳本,它必須按常規終止對文檔的解析并等待腳本執行。為了解決這個問題HTML4標準定義了defer。通過defer來提示瀏覽器可以繼續解析HTML文檔,并延遲執行腳本。這種延遲在腳本從外部文件載入時非常有用,讓瀏覽器不必等待外部文件全部載入之后才繼續執行,能有效的提高性能。IE是目前唯一支持defer屬性的瀏覽器,但IE并沒有正確的實現了defer屬性,因為延遲的腳本總是被延遲,直到文檔結束,而不是只延遲到下一個非延遲的腳本。這意味著,IE中延遲的腳本的執行順序相當混亂,并且不能定義任何后面非延遲腳本并須的函數和變量。在IE中所有的defer的腳本執行時間應該都是HTML文檔樹建立以后,window.onload之前。

    3. 利用Ajax。
      因為xmlhttPRequest能判斷外部文檔加載的狀態,所以能夠改變代碼的加載順序。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb
日本不卡高字幕在线2019| 国内免费精品永久在线视频| 91免费人成网站在线观看18| 欧美成人激情图片网| 欧美国产亚洲视频| 欧美大尺度电影在线观看| 亚洲人成在线一二| 久久精品国产免费观看| 日韩中文娱乐网| 亚洲乱码国产乱码精品精| 欧美精品性视频| 日韩精品久久久久| 欧美久久久精品| 国产91精品不卡视频| 欧美日韩在线观看视频小说| 91精品久久久久久综合乱菊| 欧美大片免费观看在线观看网站推荐| 国产欧美日韩精品丝袜高跟鞋| 久久九九亚洲综合| 一本色道久久综合狠狠躁篇的优点| 亚洲精品自拍视频| 国产精品视频xxx| 激情懂色av一区av二区av| 国产精品亚洲美女av网站| 久久频这里精品99香蕉| 亚洲欧洲在线播放| 日本国产一区二区三区| 韩国三级日本三级少妇99| 亚洲自拍欧美色图| 正在播放亚洲1区| 中文字幕亚洲国产| 亚洲精品影视在线观看| 欧美黄网免费在线观看| 欧美在线视频一区二区| 在线看日韩av| 亚洲国产日韩精品在线| 日本三级久久久| 精品久久久久人成| 国产精品免费一区二区三区都可以| 国产日韩中文字幕| 日韩美女在线观看| 欧美在线视频免费播放| 日本精品性网站在线观看| 久久香蕉国产线看观看av| 亚洲2020天天堂在线观看| 海角国产乱辈乱精品视频| 亚洲精品理论电影| 日韩欧美999| 日韩中文字幕免费视频| 久久久在线视频| 久久九九精品99国产精品| 日韩av免费在线看| 国产精品亚洲аv天堂网| 欧美激情啊啊啊| 91麻豆桃色免费看| 亚洲欧美日韩图片| 成人在线小视频| 亚洲欧美中文日韩在线v日本| 亚洲国产91精品在线观看| 久久精品国产亚洲7777| 亚洲美腿欧美激情另类| 亚洲高清一二三区| 国产欧美精品一区二区三区介绍| 国产人妖伪娘一区91| 国产精品夜间视频香蕉| 超在线视频97| 日韩在线观看网址| 亚洲加勒比久久88色综合| 亚洲韩国欧洲国产日产av| 人人爽久久涩噜噜噜网站| 最近2019好看的中文字幕免费| 久久99视频免费| 97在线观看视频国产| 欧美午夜宅男影院在线观看| 久久激情视频免费观看| 国产91免费看片| 亚洲最新av网址| 欧美日韩另类视频| 另类美女黄大片| 欧美性一区二区三区| 三级精品视频久久久久| 国产精品一区二区性色av| 日韩在线视频二区| 国内精品伊人久久| 亚洲97在线观看| 中文字幕最新精品| 国产成人久久精品| 国产乱人伦真实精品视频| 成人久久久久爱| 亚洲午夜精品久久久久久性色| 中文字幕在线视频日韩| 久久精品在线播放| 亚洲激情视频在线| 久久亚洲精品中文字幕冲田杏梨| 国产精品黄视频| 亚洲成色777777女色窝| 国产乱肥老妇国产一区二| 久久av在线看| 久久人人爽人人爽爽久久| 亚洲国产日韩欧美在线99| 亚洲人成亚洲人成在线观看| 91精品国产高清自在线看超| 人体精品一二三区| 久久久www成人免费精品张筱雨| 亚洲最新视频在线| 中文字幕av一区二区三区谷原希美| 欧美特黄级在线| 午夜精品久久久99热福利| 亚洲成人在线视频播放| 欧美一级bbbbb性bbbb喷潮片| 成人a在线视频| 九九久久国产精品| 国产精品久久77777| 国模精品一区二区三区色天香| 欧美精品成人91久久久久久久| 自拍亚洲一区欧美另类| 国内精品久久久久伊人av| 性色av香蕉一区二区| 日韩中文字幕在线播放| 国产亚洲精品一区二区| 97在线免费观看| 少妇久久久久久| 欧美日韩免费在线观看| 成人黄色片在线| 色悠久久久久综合先锋影音下载| 精品国产成人av| 亚洲精品福利免费在线观看| 欧美另类老女人| 影音先锋欧美在线资源| 91爱视频在线| 国产午夜精品久久久| 国产ts人妖一区二区三区| 自拍亚洲一区欧美另类| 国产精品久久久久久久久久尿| 欧美一区二区大胆人体摄影专业网站| 成人精品网站在线观看| www日韩中文字幕在线看| 91精品啪在线观看麻豆免费| 欧美精品一区二区免费| 精品久久久久久中文字幕| 精品人伦一区二区三区蜜桃免费| 欧美性20hd另类| 久久久久这里只有精品| 欧美激情精品久久久久| 色香阁99久久精品久久久| 精品亚洲一区二区三区在线观看| 久久99亚洲热视| 日韩欧美一区二区在线| 亚洲精品久久久久中文字幕二区| 国产精品影片在线观看| 欧美性猛交xxxx富婆| 美女少妇精品视频| 尤物99国产成人精品视频| 欧美成aaa人片在线观看蜜臀| 欧美人交a欧美精品| 亚洲色图18p| 国产欧美在线观看| 亚洲美女av在线播放| 久久精品久久久久| 91精品国产高清久久久久久| 国产欧美精品一区二区三区-老狼| 日韩av在线免费观看一区| 久久精品视频网站| 日韩a**站在线观看|