如何在Javascript中首先追加子載入？

我想在第一個<head>標記處動態添加js文件。下面如何在Javascript中首先追加子載入？

Examble鏈接我的文件中給出：Link

代碼

<!DOCTYPE html> 
<html> 
<head> 
     <script type="text/javascript"> 
     function load() { 
     var doc = document; 
     var url = "http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"; 
     var id = 1; 
     var script = doc.createElement("script"); 
     script.type = "text/javascript"; 
     script.src = url; 
     script.id = id; 
     //alert(script); 
     var head = doc.getElementsByTagName("head")[ 0 ].appendChild(script); 

     } 
     window.onload = load; 

     </script> 
<title>Nathan</title> 
<style> 
table{ 
    width:200px; 
    margin:0 auto; 
    background-color:#eee; 
    text-align:center; 
    cursor:pointer; 
} 
th{ 
    background-color:#333; 
    color:#FFF; 
} 
div#lyrics{ 
    width:200px; 
    height:400px; 
    background-color:#7C8698; 
    position:absolute; 
    left:500px; 
    padding:10px; 

} 
</style> 
<script type="text/javascript"> 

$(document).ready(function(){ 

    $("div#lyrics").hide(); 

    $("#songlist tr").mouseover(function(){ 
     $(this).css("background-color","#ccc"); 
     $("#lyrics",this).show(); 
    }).mouseout(function(){ 
     $(this).css("background-color","#eee"); 
     $("#lyrics",this).hide(); 
    }); 

}); 
</script> 

</head> 

<body> 
    <table id="songlist"> 
     <th>Songs</th> 
     <tr><td>song1<div id="lyrics">la la la song1</div></td></tr> 
     <tr><td>song2<div id="lyrics">doo doo doo song2</div></td></tr> 
     <tr><td>song3<div id="lyrics">fee fi fo fum song3</div></td></tr> 
     <tr><td>song4<div id="lyrics">hmm hmmm song 4</div></td></tr> 
     <tr><td>song5<div id="lyrics">ma ma mi mi song5</div></td></tr> 
     </tr> 
    </table> 
</body> 
</html>

動態腳本成功增加，但其增加楦頭標記。所以我的jQuery功能不工作。所以請告訴我我怎麼可以加載在第一次我的動態腳本頭標記

來源

2013-07-30 Nathan Srivi

只是出於好奇，爲什麼不只是在'

使用.insertBefore()和.firstChild代替.appendChild()

來源

2013-07-30 08:38:14 Virus721

或者有可能存在一個函數「prependChild（）」，但我不知道。 – Virus721

我已經試過了。但我的jquery功能不起作用 –

@ Virus721 nope，雖然很奇怪。 – andlrc

在編寫代碼時，第二個腳本標記中的內容在加載jQuery之前運行。那時「$」沒有被定義。

window.onload = load;

表示您將加載函數中的內容在「onload」中運行。但顯然，腳本標籤中的內容已經在運行。在定義的腳本標籤中的所有腳本都被執行之前，定義的「load」函數將不會被執行。

然後，當然，實際下載文件需要一些時間。

如果您必須異步加載jQuery，還必須將所有依賴於jQuery的JavaScript放入一些只有在jQuery成功加載後纔會執行的回調中。

來源

2013-07-30 08:44:08

@NULL做出了一個很好的回答，展示瞭如何在回調中放置所有依賴jQuery的JavaScript。 –

相關問題