用图像更改li里面的文字

Question

我想改变里面的文字.但这个李有一个img.这里的html:

<div>
<ul>
<li><b><img src="../../../Images/folder1/image1.png">Text1</b><i>0</i></li>
<li><b><img src="../../../Images/folder1/image2.png">Text2</b><i>1</i></li>
<li><b><img src="../../../Images/folder1/image3.png">Text3</b><i>2</i></li>
<li><b><img src="../../../Images/folder1/image4.png">Text4</b><i>3</i></li>
<li><b><img src="../../../Images/folder1/image5.png">Text5</b><i>4</i></li>
</ul>
</div>

我在尝试这个:

$("li").each(function () {
$(this).text(sometext);
})

但它正在取代所有人,包括img.我只想更改文本:Text1,Text2,...

有任何想法吗？

谢谢!

Answer 1

要获取您需要使用的元素中的文本节点contents(),然后filter()使用nodeType.然后,您可以使用replaceWith()更改文本.试试这个:

$('li:first b').contents().filter(function() {
    return this.nodeType == 3;
}).replaceWith('foo');

示例小提琴

我显然硬编码使用第一个li元素,但您可以根据需要更改选择器.