在這里，我們要確保正確加載腳本。您可以在嘗試動態加載腳本時嘗試使用偵聽器，并確保正確加載腳本。
您可以收聽 Mutation Events，但由于性能和瀏覽器兼容性問題不再推薦
https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Mutation_events
第二種選擇是將事件附加到附加的 childNode。實際上，appendChild 方法返回 childNode，它可以監聽 window 觸發的 3 個事件。
這是一個潛在的香草 javascript 實現：
const id = "scriptID";
const src = "your script src";
const scriptElement = document.getElementById(id);
if (!scriptElement) {
const script = document.createElement("script");
if (script) {
script.src = src;
script.id = id;
const loadError = () => throw new Error("can't load the script")
const loadSuccess = () => console.log("loaded");
const attachedScript = document.body.appendChild(script);
const onloadEvent = attachedScript.addEventListener("load", loadSuccess);
const onerrorEvent = attachedScript.addEventListener("error", loadError);
const onavortEvent = attachedScript.addEventListener("abort", loadError);
} else {
const error = "can't load the script";
throw new Error(error);
}
}
但是，上述解決方案在頁面完全加載（包括資產）時偵聽由 window 觸發的 load 事件，這與加載 DOM 但不等待加載資產時觸發的 DocumentContentLoaded 事件形成對比：
https://developer.mozilla.org/en-US/docs/Web/API/Document/DOMContentLoaded_event
上面的問題是 load 事件應該在第一次加載時使用，而不是在 DOM 發生突變時使用。
https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
一個更優雅的解決方案是使用而不是 MutationObserver，這意味著替換 MutationEvents 功能：
https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver
const id = "scriptID";
const src = "https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.9/angular.js";
const scriptElement = document.getElementById(id);
if (!scriptElement) {
const script = document.createElement("script");
if (script) {
script.src = src;
script.id = id;
const observer = new MutationObserver(() => {
console.log("change being done");
observer.disconnect();
});
const config = { attributes: false, childList: true, subtree: true };
observer.observe( document.body, config);
document.body.appendChild(script)
} else {
const error = "can't load the script";
throw new Error(error);
}
}
MutationObserver 會尋找 DOM 突變，但它不會在腳本實際加載時觸發，因此也使用 window 的 load 事件會使解決方案更強大。
現在，為什么只需要在 DOM 中附加一個腳本就需要所有這些？其中一些原因是：
