<div class="title">
I am text node
<a class="edit">Edit</a>
</div>
我希望获得“我是文本节点”，不希望删除“编辑”标签，并且需要跨浏览器解决方案。
如何获取元素的文本节点？
IT技术
javascript
jquery
2021-02-09 03:35:19
6个回答
var text = $(".title").contents().filter(function() {
return this.nodeType == Node.TEXT_NODE;
}).text();
这将获取contents所选元素的 ，并对其应用过滤器功能。filter 函数只返回文本节点（即那些带有 的节点nodeType == Node.TEXT_NODE）。
另一种可用于“复杂”或深度嵌套元素的原生 JS 解决方案是使用NodeIterator。将NodeFilter.SHOW_TEXT作为第二个参数（“whatToShow”），并逐一只是元素的文本节点孩子。
var root = document.querySelector('p'),
iter = document.createNodeIterator(root, NodeFilter.SHOW_TEXT),
textnode;
// print all text nodes
while (textnode = iter.nextNode()) {
console.log(textnode.textContent)
}<p>
<br>some text<br>123
</p>您也可以使用TreeWalker. 两者之间的区别在于它NodeIterator是一个简单的线性迭代器，同时还TreeWalker允许您通过兄弟姐妹和祖先进行导航。
如果您的意思是获取元素中第一个文本节点的值，则此代码将起作用：
var oDiv = document.getElementById("MyDiv");
var firstText = "";
for (var i = 0; i < oDiv.childNodes.length; i++) {
var curNode = oDiv.childNodes[i];
if (curNode.nodeName === "#text") {
firstText = curNode.nodeValue;
break;
}
}
你可以在这里看到这个：http : //jsfiddle.net/ZkjZJ/
返回第一个 #text 节点内容的 ES6 版本
const extract = (node) => {
const text = [...node.childNodes].find(child => child.nodeType === Node.TEXT_NODE);
return text && text.textContent.trim();
}