使用document.createElement("script") 同步執行JavaScript 模組
對JavaScript 檔案的呼叫通常是異步的,這表示後續程式碼執行可能會在載入和評估外部腳本之前發生。在使用外部腳本中定義的函數或變數時,這可能會帶來挑戰。
同步執行的一種方法是對建立的腳本元素使用 onload 處理程序。處理腳本後,此處理程序將呼叫所需的函數或程式碼。
<code class="javascript">const script = document.createElement('script'); script.onload = () => { // Script loaded and ready console.log("Script loaded and ready"); }; script.src = "http://whatever.com/the/script.js"; document.getElementsByTagName('head')[0].appendChild(script);</code>
但是,Internet Explorer 不會觸發腳本標記的「載入」事件,因此需要其他同步方法。範例包括執行 XMLHttpRequest 來檢索腳本並手動執行它,或將腳本文字插入動態建立的腳本標記中。
為了改善腳本管理和處理特殊情況,建議考慮強大的腳本載入工具,例如如 RequireJS 或 yepnope,現已與 Modernizr 整合。
以上是如何在瀏覽器中同步執行JavaScript模組?的詳細內容。更多資訊請關注PHP中文網其他相關文章!