Question

我想知道为什么在classList为空字符串时会显示以下警告：

<p id="p">Hello, world!</p>
<button id="b">Button</button>
<script>
    document.getElementById('b').onclick = function () {
        if (document.getElementById('p').classList) {
            alert('Full!');
        }
    };
</script>

DEMO

Answer 1

classList存在，但没有长度。请尝试使用document.getElementById('p').classList.length。

Answer 2

因为classList是DOMTokenList类型的对象，其中包含一些被覆盖的方法，例如toString()（这就是alert(document.getElementById('p').classList)显示空字符串的原因）等等。

因此，当您执行if (document.getElementById('p').classList) {时，您确实感觉像 if（Object）{，在这种情况下 if 会通过。

要确保 - 请参阅typeof(document.getElementById('p').classList) - 它将是collection。还尝试在控制台document.getElementById('p').classList.__proto__中编写 - 您将看到DOMTokenList - 原型对象，其中包含指向DOMTokenList构造函数（document.getElementById('p').classList.__proto__.constructor）的链接。

详细了解DOMTokenList - https://developer.mozilla.org/en/docs/Web/API/DOMTokenList

Empty classList返回true

2 个答案: