我嘗試了兩段代碼，其中一段有效，另一段無效，我不確定為什么會發生這種情況，因為兩段代碼看起來都與我相似。我想要做的是每次用戶單擊按鈕時列印不同的文本。首先，代碼沒有按照我想要的那樣作業，結果總是出錯，每次我點擊它時，文本和控制臺都沒有改變，除了err旁邊的數字外，控制臺一直在增加
function func1() {
let x = document.getElementById("test1").innerHTML;
if (x===""){
x = "First click";
console.log("err");
}
else if (x==="First click") {
x = "Second click";
console.log("err2");
}
else {
x = "Third click";
}
}
document.getElementById("click").addEventListener("click", func1);
完美運行的第二段代碼是：
function func1() {
let x = document.getElementById("test1");
if (x.innerHTML===""){
x.innerHTML = "First click";
console.log("err");
}
else if (x.innerHTML==="First click") {
x.innerHTML = "Second click";
console.log("err2");
}
else {
x.innerHTML = "Third click";
}
}
document.getElementById("click").addEventListener("click", func1);
uj5u.com熱心網友回復：
重新分配變數沒有任何副作用（幾乎在所有情況下）——someVar = newValue如果代碼的其他部分someVar稍后參考，這樣做只會導致更改。
當你做
let x = document.getElementById("test1").innerHTML;
您呼叫.innerHTML元素的getter，它回傳 HTML 字串并將該字串放入x變數中。將新字串放入x變數不會改變元素。您必須分配給.innerHTML元素的屬性才能呼叫 setter，這就是為什么
x.innerHTML = "Second click";
作品。
uj5u.com熱心網友回復：
如果你真的想使用x = 語法來修改元素的文本，你能得到的最接近的是在視窗上定義一個屬性來轉發值。
Object.defineProperty(window, 'x', { get: () => document.getElementById("test1").innerText, set: (val) => document.getElementById("test1").innerText = val });
x // gives text value
x = 'asdf' // sets to 'asdf'
當然，這對于簡單地避免添加 a 來說非常過分并且不必要.innerText，除非它對您的目的非常重要，否則我不建議您這樣做。
更簡單、更安全的方法是簡單地定義一個函式。
function x(v) {
if (v) document.getElementById("test1").innerText = v;
return document.getElementById("test1").innerText;
}
x() // gives text value
x('asdf') // sets to 'asdf'
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/399361.html
標籤：javascript dom 错误处理 添加事件监听器 内页