使用.text（）仅检索未嵌套在子标记中的文本

若是我有这样的html：

<li id="listItem">
    This is some text
    <span id="firstSpan">First span text</span>
    <span id="secondSpan">Second span text</span>
</li>

我正在尝试使用.text()仅检索字符串“ This is some text”，可是若是我要说$('#list-item').text() ，则会获得“ This is some text” textSecond span text”。

有没有一种方法能够获取（并可能经过.text("")类的东西删除）标签中的自由文本，而不是其子标签中的文本？

HTML不是我编写的，所以这是我必须使用的。 我知道写html时只将文本包装在标签中会很简单，可是html是预先编写的。

---

#1楼

不是代码：

var text  =  $('#listItem').clone().children().remove().end().text();

只是为了jQuery而成为jQuery吗？ 当简单的操做涉及那么多的连接命令和那么多的（没必要要的）处理时，也许是时候编写jQuery扩展了：

(function ($) {
    function elementText(el, separator) {
        var textContents = [];
        for(var chld = el.firstChild; chld; chld = chld.nextSibling) {
            if (chld.nodeType == 3) { 
                textContents.push(chld.nodeValue);
            }
        }
        return textContents.join(separator);
    }
    $.fn.textNotChild = function(elementSeparator, nodeSeparator) {
    if (arguments.length<2){nodeSeparator="";}
    if (arguments.length<1){elementSeparator="";}
        return $.map(this, function(el){
            return elementText(el,nodeSeparator);
        }).join(elementSeparator);
    }
} (jQuery));

致电：

var text = $('#listItem').textNotChild();

这些参数是在遇到不一样状况的状况下，例如

<li>some text<a>more text</a>again more</li>
<li>second text<a>more text</a>again more</li>

var text = $("li").textNotChild(".....","<break>");

文字将具备价值：

some text<break>again more.....second text<break>again more

---

#2楼

简单答案：

$("#listItem").contents().filter(function(){ 
  return this.nodeType == 3; 
})[0].nodeValue = "The text you want to replace with"

---

#3楼

使用额外的条件来检查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/

---

#4楼

你能够试试这个

alert(document.getElementById('listItem').firstChild.data)

---

#5楼

更轻松快捷：

$("#listItem").contents().get(0).nodeValue