提取节点的文本，忽略childNodes

Question

给出一个简单的结构，如下所示：

<td><span>Text1</span></td>
<td><span>Text2</span></td>
<td><span>Text3</span></td>
<td><span><a href='#'>Link</a>Text4</span></td>

我正在尝试使用Java脚本提取所有Text1-4，而没有任何子节点。

cols的循环

...
x = rows[i].getElementsByTagName("TD")[n].getElementsByTagName('span')[0];
...

每个x的输出

Test1
Test2
Test3
<a href='#'>Link</a>Text4

是否有一种简单的方法来“忽略”元素的html标签？

编辑

我尝试过

if(x.hasChildNodes()){
    x = rows[i].getElementsByTagName("TD")[n].getElementsByTagName('span')[0].getElementsByTagName('a')[0];
}

但这显然给了我Link

Answer 1

使用.innerText为您获取文本和所有嵌套文本，并以div替换td为您的示例，我只是添加了它以显示结果

const tags = document.querySelectorAll('div > span');

tags.forEach(tag => {
    const nodes = tag.childNodes;
    nodes.forEach(node => {
    	if(node.nodeType === node.TEXT_NODE) { 
        console.log(node.nodeValue);
    	}
    });
});

<div><span>Text1</span></div>
<div><span>Text2</span></div>
<div><span>Text3</span></div>
<div><span><a href='#'>Link</a>Text4</span></div>