Question

所以，假设我有一个非常基本的页面，其中包含一个正文，一个div，以及一个带有一些文本的段落元素。

<body>
  <div>
    <p>some text</p>
  <div>
</body>

取决于浏览器，body / div元素将具有文本节点（nodeType === 3，nodeValue ===“ - blank - ”）。但是，P元素将具有一个合法的文本节点，nodeValue ===“some text”。

我想知道的是什么是“假”文本节点的“nodeValue”（ - blank--）表示空白等于，因为我想编写一个if测试，它将让我过滤掉假文本节点。

示例：

var body = document.getElementsByTagName("body")[0];  // shortcut to body element.
console.log(body.childNodes[0].nodeValue) // maps to one of the fake text nodes that are blank.
// returns a blank line. What is that "blank" equal to? It's not 'null' or "" or undefined...

干杯，亚历

Answer 1

只需trim()^[docs]空白，看看还有什么东西：

if( body.childNodes[0].nodeValue.trim() ) {
    // more than white space
} else {
    // just white space
}

如果只有空格，那么你最终会得到一个假值。否则它将是真实的。

docs链接提供以下兼容性垫片：

if (!String.prototype.trim) {
    String.prototype.trim = function () {
        return this.replace(/^\s+|\s+$/g, '');
    };
}

Answer 2

您可以使用正则表达式，例如：

var re = /\S/; // Match non-whitespace
if (node.nodeType == 3 && re.test(node.nodeValue)) {
  // text node has something other than whitespace
}

注意到哪些浏览器会考虑空格以及\s匹配的内容，但这可能并不重要。

文本节点的“nodeValue”属性为空 - 我该如何测试呢？

2 个答案: