javascript - if 语句 btn.getAttr ('id' ) 与 | |总是返回 true

Question

这个问题已经有答案了:

Why does non-equality check of one variable against many values always return true? (3 个回答)

已关闭 4 年前。

通过js，我一直在检索html页面上按钮的id并将它们传递给更改字符串的函数。该函数包含一个 if 语句，当单击某些按钮时该语句应该取消，但该函数永远不会停止。

这是我的代码:

let buttons = document.querySelectorAll("button")
buttons.forEach(function(btn) {
    btn.addEventListener('click', () => {
        if (btn.getAttribute('id') != "reset" || btn.getAttribute('id') != "equals") {
            //Do something
        }
    })
})

问题是，即使 btn 的 id == "#reset"或 "#equals"函数仍然会执行。我知道 id 的接收正常，因为我通过在 js 中记录按钮 id 来测试单击时发生的情况。

此代码有效，但重复且未使用 or 运算符:

let buttons = document.querySelectorAll("button")
buttons.forEach(function(btn) {
    btn.addEventListener('click', () => {
        if (btn.getAttribute('id') != "reset") {
            if (btn.getAttribute('id') != "equals") {
            console.log(btn.getAttribute('id'))
            document.getElementById("content").textContent += btn.textContent
    }
}})
})

我希望当 id 的值为重置或等于时该函数不会执行。我知道问题出在 if 语句中，但我无法弄清楚。

Answer 1

问题是 OR 运算符。您应该改用 AND 运算符。假设单击 btn“reset”时，第一个条件返回 false，但第二个条件计算结果为 true，因此执行 if 语句。