如果我有这样的html:
<li id="listItem">
This is some text
<span id="firstSpan">First span text</span>
<span id="secondSpan">Second span text</span>
</li>
我试图使用.text()检索字符串“这是一些文本”，但如果我说$('#list-item').text()，我得到“这是一些textFirst span textSecond span文本”。
是否有一种方法可以获取(并可能通过.text("")之类的方法删除)标签中的自由文本，而不是其子标签中的文本?
HTML不是我写的，所以这是我必须与工作。我知道这将是简单的，只是包装标签的文本时编写的html，但再次，html是预先编写的。
当前回答
我不是一个jquery专家，但如何，
$('#listItem').children().first().text()
其他回答
使用一个额外的条件来检查innerHTML和innerText是否相同。只有在这种情况下，才需要替换文本。
$(function() {
$('body *').each(function () {
console.log($(this).html());
console.log($(this).text());
if($(this).text() === "Search" && $(this).html()===$(this).text()) {
$(this).html("Find");
}
})
})
http://jsfiddle.net/7RSGh/
使用简单的JavaScript在IE 9+兼容语法在短短几行:
const childNodes = document.querySelector('#listItem').childNodes;
if (childNodes.length > 0) {
childNodesLoop:
for (let i = 0; i < childNodes.length; i++) {
//only target text nodes (nodeType of 3)
if (childNodes[i].nodeType === 3) {
//do not target any whitespace in the HTML
if (childNodes[i].nodeValue.trim().length > 0) {
childNodes[i].nodeValue = 'Replacement text';
//optimized to break out of the loop once primary text node found
break childNodesLoop;
}
}
}
}
这是一个老问题，但上面的答案效率很低。这里有一个更好的解决方案:
$.fn.myText = function() {
var str = '';
this.contents().each(function() {
if (this.nodeType == 3) {
str += this.textContent || this.innerText || '';
}
});
return str;
};
然后这样做:
$("#foo").myText();
类似于公认的答案，但没有克隆:
$("#foo").contents().not($("#foo").children()).text();
下面是一个jQuery插件用于此目的:
$.fn.immediateText = function() {
return this.contents().not(this.children()).text();
};
下面是如何使用这个插件:
$("#foo").immediateText(); // get the text without children
我不是一个jquery专家，但如何，
$('#listItem').children().first().text()
