Question

<ul id="boxinoamicizie">
  <li class="first">from 
            <a href="users/valerio">valerio</a> 
               (<a href="#">Approve</a>|<a href="#">Disapprove</a>)
  </li>
  <li>from 
            <a href="users/federico">federico</a> 
               (<a href="#">Approve</a>|<a href="#">Disapprove</a>)
  </li>
  <li class="last">from <a href="users/federico">federico</a> 
               (<a href="#">Approve</a>|<a href="#">Disapprove</a>)
  </li>
 </ul>

我需要删除“from”并留下我尝试使用的其余字符串

 $('.item-list ul li').each( function(){   
     var text = this.textContent;
     this.textContent = text.replace( /from/g, "" );
  });

但它取消了我“来自”和来自html代码的链接

有人可以给我一些帮助吗？

编辑：

我需要的结果是

<ul id="boxinoamicizie">
 <li class="first">
        <a href="users/valerio">valerio</a> 
           (<a href="#">Approve</a>|<a href="#">Disapprove</a>)
  </li>
  <li>
        <a href="users/federico">federico</a> 
           (<a href="#">Approve</a>|<a href="#">Disapprove</a>)
  </li>
  <li class="last">
        <a href="users/federico">federico</a> 
           (<a href="#">Approve</a>|<a href="#">Disapprove</a>)
 </li>
</ul>

Answer 1

迭代文本节点，如果它包含from：

，请将其删除

$('.item-list ul li').contents().each(function() {
    if(this.nodeType === 3 && /^\s*from\s*$/.test(this.nodeValue)) {
        this.parentNode.removeChild(this);
    }
});

DEMO

this.textContent = this.textContent.replace( /from/g, "" )没有给出所需结果的原因很简单：

.textContent会返回元素和所有后代的文字，即您获得

"from valerio (Approve|Disapprove)"

从该字符串中删除from，然后将结果重新分配给元素。这将取代元素的当前内容。

您可以使用$(this).html()来处理元素的HTML内容，但是如果您在链接中注册了事件侦听器，那么它们将被销毁，因为您正在销毁和重新创建DOM元素。

Answer 2

无需做任何事情......只需更改Jquery代码......

$('ul#boxinoamicizie li').each(function() {
    var text = $(this).html();
    txt = text.replace(/from/g, "");
    $(this).html(txt);
});

查看此演示：

http://jsfiddle.net/XNMje/2/

Answer 3

如果您要将{from}放在span中，您可以更轻松地使用jQuery导航DOM树：

<ul id="boxinoamicizie">
  <li class="first">
    <span>from</span>
    <a href="users/valerio">valerio</a> 
    <span>(<a href="#">Approve</a>|<a href="#">Disapprove</a>)</span>
  </li>
</ul>

现在你可以告诉jQuery从列表项中删除第一个子元素。

如何从ul中删除特定文本

3 个答案: