document.ready（）上的Javascript文件優先級

當我們使用文檔準備好內聯腳本函數時，按照需要的順序調用JavaScript文件很重要嗎？document.ready（）上的Javascript文件優先級

例如，假設我想在jQuery Waypoint下調用jQuery的反向插件。它需要在文檔的頁眉分別加載了jQuery，航點和最終反了腳本，並在下面的內嵌腳本調用counterup()：

<script> 
     $('.counter').counterUp({ 
      delay: 10, 
      time: 1000 
     }); 
    </script>

如果我叫$(document).ready下，該功能會發生什麼並將腳本導入語句移動到<body>的底部？

是否需要分別在主體底部調用所需文件？（例如，在所有其它的庫的結束進口jquery.min.js。）

來源

2014-09-30 bobsilon

如果導入'jquery'，...低於任何使用try的腳本在評估時使用jQuery，則它將失敗。例如如果你想把你的示例代碼放在'$（document）.ready'中，它仍然需要在之前包含'jQuery'。如果你把它放在一個由'setTimeout'調用的回調函數中，如果在這段時間內加載了'jQuery'，它可能會工作。 – 2014-09-30 07:43:41

@您指出的Rraham問題是關於內聯腳本的優先級。但是我詢問了內聯腳本所需的鏈接JavaScript文件的優先級。他們是平等的嗎？！ – bobsilon 2014-09-30 07:49:23

$將拋出基準誤差如果jQuery的沒有前文所定義（即，如果jquery.min.js不$求值之前導入）。

所以你必須首先在<script>之前用jquery添加一個<script>標籤，用你的自定義代碼，順便說一下，它應該在一個單獨的文件中。

然後，由於<script>可以修改DOM，因此即使您將它們放在<html>標記之外，在所有JS文件被下載並評估和執行之前，「DOM就緒」事件都不會被觸發。

話雖這麼說，如果（且僅當）你用的插件代碼都是「domready中」回調裏面，你可以用你的自定義代碼後的插件，這樣添加腳本標籤：

<!DOCTYPE html> 
<html> 
<head> 
    <title>JS Bin</title> 
    <meta charset="utf-8"> 


    <link rel="stylesheet" href="//cdn.jsdelivr.net/jquery.tooltipster/2.1.4/css/tooltipster.css"> 
</head> 
<body> 
    <div id="test" title="Beautiful tooltip plugin!">Hello world!</div> 
</body> 
    </html> 
    <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> 
    <script> 
    jQuery(function($) { 
     $("#test").tooltipster(); 
     console.log('Test OK'); 
    }); 

    </script> 
    <script src="//cdn.jsdelivr.net/jquery.tooltipster/2.1.4/js/jquery.tooltipster.min.js"></script>

請參閱jsbin

來源

2014-09-30 08:08:21 laruiss

只是爲了完整性：'script'標籤必須是'head'或'body'的後代。如果它是'html'的孩子，或者甚至不在'html'之外，那麼這將是無效的HTML，然後瀏覽器需要修復它。關於ready事件：腳本被標記爲「async」或「defer」，或者腳本的加載和執行被前面包含的腳本抑制/延遲時，可能會有異常。 – 2014-09-30 23:27:06

document.ready（）上的Javascript文件優先級

回答

相關問題