Как удалить текстовый узел?

Question

, пожалуйста, удалите текстовый узел «Бесплатно!».

вот моя попытка на 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> 

Answer 1

document.querySelector('.star-rating') 

даст вам только первый узел согласования.

Вы должны использовать document.querySelectorAll, который будет возвращать список из узла

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

Answer 2

Установите некоторый идентификатор в этот кивок и удалить его с $ («# что-nod- id ") .remove();

Answer 3

Если вы хотите, чтобы удалить каждый элемент, содержащий «бесплатно!» с помощью JQuery (это то, что вы имеете в виду текстовый узел?), то вы можете использовать селектор JQuery :contains, чтобы найти эти элементы, и удалите их:

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

Вот JSFiddle демонстрирует это.

Если вы не хотите удалять весь узел (это не так ясно из вашего вопроса), то - это объект jQuery, содержащий все элементы, дочерние элементы которых вы хотите удалить. Это облегчит вам поиск подходящих детей <li> и удалит их из DOM.

Answer 4

Ваш «Бесплатно!» текст не находится в элементе сам по себе. Он находится под элементом 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>