動態加載外部庫失敗

我有一個iframe在另一個文件，我想放一個D3動畫。由於我無法訪問主頁面的文件，因此我動態加載了src。動態加載外部庫失敗

事情是，如果我有一個alert（）加載函數庫函數和使用它的函數之間的一切工作正常。但沒有它（這是我以後）我得到的控制檯錯誤，D3是未知的。

我試着把window.onload中的d3Check（），我試圖把它放在setTimeout中，但沒有運氣。

爲什麼會發生這種情況，以及如何使它運行平穩，沒有警報？

<!DOCTYPE html> 
<html> 
<body> 

<input id="btn" type="button" value="Click me"/> 

<script> 

function d3Load() { 
    var jsElm = document.createElement("script"); 
    jsElm.type = "text/javascript"; 
    jsElm.src = "https://d3js.org/d3.v4.min.js"; 
    jsElm.charset = "utf-8"; 
    document.head.appendChild(jsElm); 
//debugger; 
}; 
//debugger; 

function d3Check() { 
var a = d3.select("body"); 
alert("good"); 
}; 

d3Load(); 
alert(); 
d3Check(); 

</script> 

</body> 
</html>

來源

2017-04-13 Zenon

設置的jsElem的src屬性後，源將被異步地在後臺加載的，所以你可能要等待加載完成，直到你繼續。這可以使用script標籤的onload屬性來完成： https://developer.mozilla.org/de/docs/Web/API/HTMLScriptElement

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<input id="btn" type="button" value="Click me"/> 
 

 
<script> 
 

 
function d3Load() { 
 
    var jsElm = document.createElement("script"); 
 
    jsElm.type = "text/javascript"; 
 
    jsElm.src = "https://d3js.org/d3.v4.min.js"; 
 
    jsElm.charset = "utf-8"; 
 
    jsElm.onload = d3Check; 
 
    document.head.appendChild(jsElm); 
 
}; 
 

 

 
function d3Check() { 
 
var a = d3.select("body"); 
 
alert("good"); 
 
}; 
 

 
d3Load(); 
 

 
</script> 
 

 
</body> 
 
</html>

來源

2017-04-13 11:32:30 volzo

謝謝，但我得到了同樣的結果。我應用了您提到的importScript，並將庫正確加載到中，但未能使用它。在alert（）之間加載和使用 - 再次一切正常。我還嘗試強制代碼等待5秒鐘，然後嘗試應用它，但似乎沒有我點擊警報，它只是不加載 – Zenon

@Zenon，我添加了一段代碼段，詳細介紹了volzo的建議。 – Mark

作品，謝謝很多傢伙！ – Zenon

您需要在嘗試使用任何包含的方法之前，要等待劇本的Load事件。

jsElm.onload = d3Check();

更多細節here

來源

2017-04-13 12:11:26

明白了，謝謝你！ – Zenon

動態加載外部庫失敗

回答

相關問題