Question

我正在尝试创建一个选择器，它将抓取li元素并显示文本。问题是在li标记内部我有span标记，并且也会显示。

如何在没有内部元素的情况下获取最接近元素的文本？

看到这里，我不想要“编辑”这个词。被包括。 http://jsfiddle.net/ozyf87tb/

<li>This is the story of the Jungle book
<form action="" method="" class="form_edit">
<textarea class="inte" value="" name="inte"></textarea>
</form>
<span class="edit">Edit</span>
</li>

$(".edit").click( function(ev) {
var a = $(this).closest('li').text();
$('.inte').val(a);
});

Answer 1

http://jsfiddle.net/ozyf87tb/7/

克隆它（所以你使用克隆，而不是在DOM中），获取子项，删除子项，获取文本。

$(".edit").click( function(ev) {

 var a = $(this).closest('li').clone().children().remove().end().text();

$('.inte').val(a);
});

Answer 2

执行您要执行的操作的最可读方式是使用<span class='myText'></span>之类的容器包围文本。所以你可以使用它的类选择确切的容器： DEMO

<li><span class='myText'>This is the story of the Jungle book</span>
<form action="" method="" class="form_edit">
<textarea class="inte" value="" name="inte"></textarea>
</form>
<span class="edit">Edit</span>
</li>

$(".edit").click( function(ev) {
var a = $(this).prevAll('.myText').text();
$('.inte').val(a);
});

Answer 3

首先，获取html的clone()。

var a = $(this).closest('li').clone();

然后删除无关的跨度。

a.find('span').remove();

然后将其放入textarea。

$('.inte').val( a.text() );

这也可以重写为单个字符串，但不会影响可读性。

var a = $(this).closest('li').clone().find('span').remove().end().text();
$('.inte').val( a );

jsfiddle

Answer 4

使用contents()，然后过滤您的选择以仅返回文本节点。然后你需要做的就是修剪任何空白区域：

var a = $.trim($(this).closest('li').contents().filter(function(){
    return this.nodeType == 3;  
}).text());

JSFiddle

<强>文档

最近的没有跨度的李

4 个答案: