javascript:检查空白textNode

Question

检查DOM文本节点是否为空的最佳方法是什么？我所说的空白仅指空格、回车符、制表符等。如果它包含nbsp；，则它不是空白。

我在做：

element.nodeValue.trim().length != 0

然而，这也摆脱了nbsp;，这是我不想要的。

(它是针对Chrome扩展的，所以使用trim是可以的--没有IE!)

Answer 1

我最终用一个字符替换了nbsp；，然后进行了修剪。

element.nodeValue.replace(/\u00a0/g, "x").trim().length != 0

基于Replacing   from javascript dom text node

Answer 2

像这样的东西

HTML

<div id="test1">        
    </div>
<div id="test2">    &nbsp;      
    </div>

Javascript

var test1 = document.getElementById("test1");
var test2 = document.getElementById("test2");

function escapeHTML(str) {
    var pre = document.createElement('pre');
    pre.appendChild(document.createTextNode(str));
    return pre.innerHTML;
}

console.log(escapeHTML(test1.textContent).trim().length === 0);
console.log(escapeHTML(test2.textContent).trim().length === 0);

在jsfiddle上

输出为

true
false

或使用nodeValue

Javascript

var test1 = document.getElementById("test1").firstChild;
var test2 = document.getElementById("test2").firstChild;

function escapeHTML(str) {
    var pre = document.createElement('pre');
    pre.appendChild(document.createTextNode(str));
    return pre.innerHTML;
}

console.log(escapeHTML(test1.nodeValue).trim().length === 0);
console.log(escapeHTML(test2.nodeValue).trim().length === 0);

输出

true
false

在jsfiddle上

请参阅Node.nodeValue和Node.textContent

Node.nodeValue

返回或设置当前节点的值。

下表显示了不同元素的返回值：...

Text:文本节点的内容

Node.textContent

获取或设置节点及其子代的文本内容。

在第一个例子中，我得到了div元素及其后代的文本内容。

在第二种情况下，我选择div的第一个文本节点，它恰好是第一个子节点，并获得它的节点值。

Answer 3

if ( element.textContent.trim() ) ...

编辑，真正想说的是：

if ( element.innerHTML.trim() ) ...