Empty classList返回true

时间:2014-06-20 14:04:46

标签: javascript html boolean

我想知道为什么在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

2 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:0)

因为classListDOMTokenList类型的对象,其中包含一些被覆盖的方法,例如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