如何删除文本节点

how to delete a text node?

本文关键字：文本 节点 删除 何删除      更新时间：2023-09-26

请帮助删除文本节点"Бесплатно！"。

这是我对JSFIDDLE的尝试。 问题是我只删除了第一个节点，但其他节点仍然存在

以下是简化的代码：

<ul class="product_list_widget">
    <li>
        <a href="http://qqq.ru/shop/granit/104/" title="qqq">
            <img width="90" height="90" src="http://qqq.ru/wp-content/uploads/2013/08/104-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="104">
            qqq                 
        </a> 
        <div class="star-rating" title="Рейтинг 3.50 из 5">
            <span style="width:70%">
                <strong class="rating">3.50</strong> из 5</span>
                <b class="rate_content">Рейтинг 3.50 из 5</b>
        </div>deleteNode
    </li>
    ......
    ......
    ......
    ......
</ul>

<script>
// priceless hide
document.querySelector('.star-rating').parentNode.removeChild( document.querySelector('.star-rating').nextSibling );
</script>

document.querySelector('.star-rating')

只会给你第一个匹配的节点。

你应该使用 document.querySelectorAll，它将返回一个节点列表

var x = document.querySelectorAll('.star-rating');
for(var i in x){
    x[i].parentNode.removeChild( x[i].nextSibling );
}
如果你想

使用jQuery删除每个包含"Бесплатно！"的元素（这就是你所说的文本节点吗？），那么你可以使用jQuery :contains选择器来查找这些元素，并删除它们：

$("li:contains('Бесплатно!')").remove();

这是一个JSFiddle演示了这一点。

如果您不想删除整个节点（从您的问题中不太清楚），那么$("li:contains('Бесплатно!')")是一个 jQuery 对象，其中包含您要从中删除元素的所有元素。 这将使您更容易找到合适的<li>子项并将其从 DOM 中删除。

你的"Бесплатно！"文本本身并不在一个元素中。它位于 li 元素下，我想删除该元素是不可取的。您可以操纵其innerHTML以删除该文本。

var li = document.querySelectorAll('li');
for (i = 0; i < li.length; i++) {
  li[i].innerHTML = li[i].innerHTML.replace("Бесплатно!", "");
}
<ul class="product_list_widget">
  <li>
    <a href="http://plastushka.ru/shop/granit/103/" title="Мансуровский">
      <img width="90" height="90" src="http://plastushka.ru/wp-content/uploads/2013/08/1031-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="103" />Мансуровский
    </a>
    <div class="star-rating" title="Рейтинг 5.00 из 5"><span style="width:100%"><strong class="rating">5.00</strong> из 5</span><b class="rate_content">Рейтинг 5.00 из 5</b>
    </div>Бесплатно!</li>
  <li>
    <a href="http://plastushka.ru/shop/granit/193/" title="Сахара">
      <img width="90" height="90" src="http://plastushka.ru/wp-content/uploads/2013/08/193-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="193">Сахара</a>
    <div class="star-rating" title="Рейтинг 5.00 из 5"><span style="width:100%"><strong class="rating">5.00</strong> из 5</span><b class="rate_content">Рейтинг 5.00 из 5</b>
    </div>Бесплатно!</li>
  <li>
    <a href="http://plastushka.ru/shop/granit/215/" title="Южно-Султаевский">
      <img width="90" height="90" src="http://plastushka.ru/wp-content/uploads/2013/08/215-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="215">Южно-Султаевский</a>
    <div class="star-rating" title="Рейтинг 4.67 из 5"><span style="width:93.4%"><strong class="rating">4.67</strong> из 5</span><b class="rate_content">Рейтинг 4.67 из 5</b>
    </div>Бесплатно!</li>
  <li>
    <a href="http://plastushka.ru/shop/granit/287/" title="Жельтау-5">
      <img width="90" height="90" src="http://plastushka.ru/wp-content/uploads/2013/08/287-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="287">Жельтау-5</a>
    <div class="star-rating" title="Рейтинг 4.50 из 5"><span style="width:90%"><strong class="rating">4.50</strong> из 5</span><b class="rate_content">Рейтинг 4.50 из 5</b>
    </div>Бесплатно!</li>
  <li>
    <a href="http://plastushka.ru/shop/granit/104/" title="Камбулатовский">
      <img width="90" height="90" src="http://plastushka.ru/wp-content/uploads/2013/08/104-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="104">Камбулатовский</a>
    <div class="star-rating" title="Рейтинг 3.50 из 5"><span style="width:70%"><strong class="rating">3.50</strong> из 5</span><b class="rate_content">Рейтинг 3.50 из 5</b>
    </div>Бесплатно!</li>
</ul>

为该点头设置一些 id 并将其删除$（ "#that-nod-id" ）.remove（）;

相关文章：