在HTML中動態追加jquery

我是jquery的新手。我試圖在java中的HTML頁面追加Jquery。包括我寫的jquery.js文件下面的代碼：在HTML中動態追加jquery

scriptTag += "var script = document.createElement('script');" + 
"script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'; " + 
"script.type = 'text/javascript'; " + 
"document.getElementsByTagName('head')[0].appendChild(script);" +

，然後我附加在與它

"var script2 = document.createElement('script'); window.onload = function() {" + 
"$(document).ready(function() {" + 
"$(\"#identity\").hide();});};" + 
"script2.type = 'text/javascript'; " + 
"document.getElementsByTagName('head')[0].appendChild(script2);";

所以基本上我想寫這個js + jQuery代碼：

var script = document.createElement('script'); 
script.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'; 
script.type = 'text/javascript'; 
document.getElementsByTagName('head')[0].appendChild(script); 
var script2 = document.createElement('script'); 
window.onload = function() { 
    $(document).ready(function() { 
     $("#identity").hide(); 
    }); 
    }; 
script2.type = 'text/javascript'; 
document.getElementsByTagName('head')[0].appendChild(script2);

我想要做的是，我想我的功能窗口加載後。不知何故，單獨寫作$(document).ready(function() { does not工作。我得到一個錯誤，未定義$（看起來像jquery.js還沒有準備好）。

爲避免此問題，我使用了window.onload = function() {。但現在我得到錯誤：$(document).ready is not a function。在這裏我很困惑如何寫這個東西。這是正確的方法嗎？任何幫助/指導，高度讚賞。

[編輯]

請注意，下面的代碼（不包括jQuery的）正常工作：

window.onload = function() { 
document.getElementById('identity').style.visibility='hidden'; 
};

[編輯]

其實我想提出一個web代理，在那裏我下載頁面並以自定義的外觀和視野爲他們服務。這些頁面不包含任何jquery文件，也不能包含或編寫HTML。我只能加我的js動態地使用Java等

來源

2012-07-02 Umer Hayat

這不是腳本加載的一般工作方式;你需要在jQuery中查看['.getScript（）']（http://api.jquery.com/jQuery.getScript/）並將其放入一個文件中以包含URL。在Javascript中添加腳本有點微妙，jQuery並沒有使它更容易。 –

'script2'爲空 – Alexander

@Alexander：不，它不是。你能用代碼指出嗎？ –

下面是一些代碼，演示瞭如何動態地加載一個腳本文件，也延緩的$（document）調用。就緒，直到該文件已加載：

http://jqfaq.com/how-to-load-java-script-files-dynamically/

來源

2012-07-02 10:49:22

我認爲這個例子假定一個jquery.js文件已經包含在頁面中。但在我的情況下，它不包括在內。我只能通過首先在服務器上下載頁面然後提供服務來動態包含它。 –

所以，在我的情況下，我添加了第一個jquery.js文件。 –

您用於加載jquery.min.js文件的代碼被稱爲asycnhroniously。可能這個文件在你嘗試執行jquery函數的時候還沒有被加載。因此，您應該確保使用回調函數加載文件。

下面的鏈接，你可以找到一個例子，如何給這個： http://blog.logiclabz.com/javascript/dynamically-loading-javascript-file-with-callback-event-handlers.aspx

而且，這裏是一個工作示例：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>index</title> 
    <script type="text/javascript"> 

     function loadScript(sScriptSrc, callbackfunction) { 
      //gets document head element 
      var oHead = document.getElementsByTagName('head')[0]; 
      if (oHead) { 
       //creates a new script tag 
       var oScript = document.createElement('script'); 

       //adds src and type attribute to script tag 
       oScript.setAttribute('src', sScriptSrc); 
       oScript.setAttribute('type', 'text/javascript'); 

       //calling a function after the js is loaded (IE) 
       var loadFunction = function() { 
        if (this.readyState == 'complete' || this.readyState == 'loaded') { 
         callbackfunction(); 
        } 
       }; 
       oScript.onreadystatechange = loadFunction; 

       //calling a function after the js is loaded (Firefox) 
       oScript.onload = callbackfunction; 

       //append the script tag to document head element 
       oHead.appendChild(oScript); 
      } 
     } 

     var SuccessCallback = function() { 
      $("#identity").hide(); 
     } 

     window.onload = function() { 

      loadScript('http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', SuccessCallback) 

     }; 
    </script> 
</head> 
<body> 

    <span id="identity"> This text will be hidden after SuccessCallback </span> 

</body>

你應該在你scriptTag使用此代碼變量，然後你可以使用eval（）函數來評估這個變量中的腳本。你也可以使用jQuery的getscript函數在回調函數中加載第二個JavaScript文件

來源

2012-07-02 11:58:19 nilgun

回答

相關問題