是否可以使用XMLHttpRequest評估JavaScript代碼

Question

我正在嘗試使用此AJAX請求來使用正常工作的PHP和不能正常工作的JavaScript調用文件。 有任何想法嗎？

function showpart2(){
    if(window.XMLHttpRequest){
        xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET","atuamae.org/parte2-encomendar.php",false);
        xmlhttp.send(null);
    }

    document.getElementById('part2').innerHTML = xmlhttp.responseText;
    eval(xmlhttp.responseText.getElementById('part2').innerHTML)

    setTimeout('showpart2()',15000);

}

showpart2();

Answer 1

您需要實際評估JS標簽（手動，通過eval或通過DOM插入）。 像jQuery這樣的庫將為您完成此操作，但是如果您需要使用自定義解決方案，則還需要添加它。

Answer 2

你寫：

xmlhttp.responseText.getElementById（'part2'）

responseText是一個字符串，將沒有任何getElementById方法。 您或者要使用xmlhttp.responseXML.getElementById（“ part2”）或使用字符串方法來提取第二部分。

Answer 3

像Adam Rackis一樣，我建議您使用$ .ajax確實很容易嘗試.....但是，如果它不是您的選擇，那么這里是一個用於進行ajax調用並在IE和Firefox，Chrome I中工作過的函數如果您不能使用Jquery，則向您推薦。 您的函數中的問題在IE中不起作用，因為它沒有xmlhttprequest對象。 希望這對您有所幫助。

function newAjaxObject()
{
    var oHttp=false;
    var asParsers=[
         "Msxml2.XMLHTTP.5.0", 
         "Msxml2.XMLHTTP.4.0", 
         "Msxml2.XMLHTTP.3.0", 
         "Msxml2.XMLHTTP", 
         "Microsoft.XMLHTTP"
    ];

    if ( !oHttp && typeof XMLHttpRequest != 'undefined')
    {
        oHttp=new XMLHttpRequest();
    }

 if( !oHttp){
    for (var iCont=0; !oHttp && iCont < asParsers.length; iCont++)
    {
        try
        {
            oHttp=new ActiveXObject(asParsers[iCont]);
        }
        catch(e)
        {
            oHttp=false;
        }
    }
}

   return oHttp;
}

Answer 4

示例代碼的一個大問題是，使XMLHttpRequest.send同步意味着所有JS執行必須在等待接收請求時暫停。 沒有理由不使用異步調用。

異步調用可以提高響應速度，但是它們卻無法為您提供協調，這意味着直到准備好所需的數據后，任務才能運行。 協調異步代碼的標准方法是將一個函數傳遞給異步函數，該函數在執行時將執行依賴於數據的其余計算。 該函數的技術名稱為“ continuation”，它只是一個代表從給定點開始的其余計算的函數。 也就是說，轉：

f1();
f2();
async();
f3();
f4();

變成：

f1();
f2();
async(function() {
    f3();
    f4();
});

因為您要繞過延續，所以稱為“延續通過樣式”。 XMLHttpRequest是一種特殊情況，您可以將其設置為XHR對象上的readystatechange事件的偵聽器，而不是將函數傳遞給異步函數。 也就是說，您將連續性分配給xmlhttp.onreadystatechange 。

還有一些需要改進的地方。 首先，添加錯誤檢測。 XHR實例的status屬性包含HTTP狀態，您可以使用該狀態檢查錯誤。

正如其他許多人提到的那樣， eval可能會出現問題，並且在有其他選擇時應避免使用。 一方面，您必須確保字符串來自受信任的來源。 eval的特殊問題在於，腳本在與eval調用相同的上下文中進行eval 。 如果eval發生在函數內部，則腳本定義的任何內容在函數外部均不可見。 如果您的腳本不需要定義任何內容（也不需要定義任何內容；請始終考慮代碼的未來），則可以使用eval 。 否則，以腳本為內容動態創建腳本元素，並將其添加到文檔中； 您可以定義執行此操作的函數（請參見下面的示例中的globaleval ）。

xmlhttp是全局變量，這是錯誤的。 而是將其聲明為局部變量。

可以使用setInterval ，而不是用於單次調用的setTimeout ，它會定期調用傳遞的函數。 請注意， setTimeout和setInterval可能需要比給定的延遲更長的時間運行，盡管這在這里不應該成為問題。

(function () {
    // keep variable from polluting global namespace
    var showpart2Interval = 0,
        scriptElt = {parentNode: {removeChild: function() {}}};

    function globaleval(script) {
        scriptElt.parentNode.removeChild(scriptElt);
        scriptElt = document.createElement('script');
        scriptElt.type = 'text/javascript'
        scriptElt.appendChild(document.createTextNode(script));
        document.body.appendChild(scriptElt);
    }

    function showpart2(){
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET","atuamae.org/parte2-encomendar.php",false);
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4) {
                if (200 <= xmlhttp.status && xmlhttp.status < 300) {
                    globaleval(xmlhttp.responseText);
                } else {
                    // HTTP error
                    ...
                }
            }
        }
        xmlhttp.send(null);
    }

    function startShowpart2() {
        if (window.XMLHttpRequest && !showpart2Interval) {
            showpart2();
            showpart2Interval = setInterval(showpart2, 15000);
        }
    }
    function stopShowpart2() {
        clearInterval(showpart2Interval);
        showpart2Interval = 0;
    }

    window.startShowpart2 = startShowpart2;
    window.stopShowpart2 = stopShowpart2;
})();

startShowpart2();

如果您不關心自己實現所有這些功能，請讓jQuery做繁重的工作。 知道如何自己做事很好，但是（對於生產代碼）將標准庫與標准接口配合使用可以通過多種方式加快開發速度。

也可以看看

• Javascript：設置功能順序