我在獲取 DOM 中元素的選擇器時遇到問題，我將腳本源放在 HTML 頁面的底部，我還嘗試將所有代碼包裝在具有“DOMContentLoaded”事件的函式中，但它仍然無法正常作業。此外，它禁用了我在我的專案中使用它的 jQuery。
這就是我獲得選擇器的方式：
const char = document.querySelectorAll('.text');
const num = document.querySelectorAll('span');
當我嘗試在函式中捕獲選擇器時，它會起作用，因為它等待加載 DOM。我想在我的代碼中多次使用這兩個變數，所以我希望它們全域可用并避免在許多地方重復同一行。
有沒有什么辦法可以等待 DOM 加載完畢，然后全域獲取元素選擇器？
uj5u.com熱心網友回復：
全域定義它們并使用 DOMContentLoaded 設定
let char;
let num;
window.addEventListener('DOMContentLoaded', function() {
char = document.querySelectorAll('.text');
num = document.querySelectorAll('span');
});
document.querySelector("button").addEventListener("click", () => {
console.log(char);
console.log(num);
});<div class="text"><span></span></div>
<div class="text"><span></span></div>
<button>Test</button>或者做一個吸氣劑
const elems = {
domChars: null,
domNum: null,
get chars() {
if (this.domChars === null) {
this.domChars = document.querySelectorAll('.text');
}
return this.domChars;
},
get nums() {
if (this.domNum === null) {
this.domNum = document.querySelectorAll('span');
}
return this.domNum;
}
};
document.querySelector("button").addEventListener("click", () => {
console.log(elems.chars);
console.log(elems.nums);
});<div class="text"><span></span></div>
<div class="text"><span></span></div>
<button>Test</button>轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/318139.html
標籤：javascript dom 选择器 等待
下一篇：如何檢查按鈕是否按正確順序按下？