如果我有这样的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是预先编写的。
当前回答
为了能够修剪结果，像这样使用DotNetWala's:
$("#foo")
.clone() //clone the element
.children() //select all the children
.remove() //remove all the children
.end() //again go back to selected element
.text()
.trim();
我发现使用较短的版本，如document.getElementById(“listItem”)。childNodes[0]不能使用jQuery的trim()。
其他回答
更容易和更快:
$("#listItem").contents().get(0).nodeValue
对于初学者来说:
我更喜欢@都尊的答案，因为它简单易懂，比公认的答案更有效率。但它只部分适用于我，因为你不能直接传递元素与类选择器像这样
$(".landing-center .articlelanding_detail").get(0).immediateText() //gives .immediateText is not a function error
或者这个
$(".landing-center .articlelanding_detail")[0].immediateText() //gives .immediateText is not a function error
因为一旦你从$()函数中使用[index]或.get(index)提取了原生元素，你就失去了这里提到的jQuery对象方法的可链性。大多数解决方案只在id的上下文中使用，对于带有类选择器的元素多次使用不是很优雅。
所以，我写了jQuery插件:
$.fn.mainText = function(x=0) {
return $.trim(this.eq(x).contents().not(this.eq(x).children()).text().replace(/[\t\n]+/g,' '));
};
这将返回元素的文本，而不管是否使用id或class作为排除子元素的选择器。也将删除任何\t或\n以获得一个干净的字符串。 像这样使用它:
案例1
$("#example").mainText(); // get the text of element with example id
案例2
$(".example").mainText(); // get the text of first element with example class
案例3
$(".example").mainText(1); // get the text of second element with example class and so on..
对我来说，这似乎是一个过度使用jquery的例子。下面将抓取文本，忽略其他节点:
document.getElementById("listItem").childNodes[0];
你需要修剪它，但它能让你在一个简单的线条中得到你想要的。
EDIT
上面将获得文本节点。要得到实际的文本，使用这个:
document.getElementById("listItem").childNodes[0].nodeValue;
我提出了一个具体的解决方案，应该比克隆和修改克隆更有效。这个解决方案只适用于以下两个保留，但应该比目前接受的解决方案更有效:
你得到的只是文本 要提取的文本位于子元素之前
话虽如此，下面是代码:
// 'element' is a jQuery element
function getText(element) {
var text = element.text();
var childLength = element.children().text().length;
return text.slice(0, text.length - childLength);
}
使用一个额外的条件来检查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/
