Функция для удаления указанных элементов

Question

Мне нужно создать функцию, которая получает пользовательский ввод (селектор CSS) и удаляет все эти элементы. Это функция пока

function removeBySelector(selector) {
  var thisOne = document.querySelectorAll(selector);
  for(var i = 0; i<thisOne.length; i++) {
    document.removeChild(thisOne[0]);
  };
};

И HTML, который запускает его

<button type="button" name="button" onclick="removeBySelector(prompt('Type the selector e.g p/ p.pClass'));">Remove By Selector</button>

javascript html

0

Hayk Safaryan 18 Дек 2015 в 14:30

Answer 1

Измените свой метод на

function removeBySelector(selector) 
{
  var thisOne = document.querySelectorAll(selector);
  for(var i = 0; i<thisOne.length; i++) 
  {
    thisOne[i].parentNode.removeChild( thisOne[i] ); //changed parentElement to parentNode
  };
}

1

gurvinder372 18 Дек 2015 в 11:41

Answer 2

//Try this code:

    var removeElement=function(selector){
         $(document).find(selector).remove();
        };
     removeElement('h1'); // will remove all H1 elements from Document.

0

Jhon Carpenter 18 Дек 2015 в 11:38

Answer 3

Я бы посоветовал использовать фреймворк jQuery! Это очень мощный инструмент, который помогает вам упростить и улучшить ваш код JavaScript и его производительность.

С помощью jQuery вы можете легко использовать этот фрагмент кода для удаления любых элементов с помощью селектора CSS.

// Use any CSS Selector here

var elements = $(".class");

$.each(elements, function(){

$(this).remove();

)};

Это делает ваш код очень простым для чтения и имеет высокую производительность.

0

Clemens Himmer 18 Дек 2015 в 11:37

Answer 4

Вы можете сделать то же самое, не используя библиотеку с чистым JavaScript (синтаксис ES6 в данном случае):

let elements = document.querySelectorAll(".please-remove");
elements.forEach(e => e.remove());

<div>
  <div class="keep">Keep this element</div>
  <div class="please-remove">1</div>
  <div class="please-remove">2</div>
  <div class="please-remove">3</div>
  <div class="please-remove">4</div>
  <div class="please-remove">5</div>
  <div class="please-remove">6</div>
</div>

0

Samuel Philipp 1 Сен 2019 в 20:05

Функция для удаления указанных элементов

4 ответа

Похожие вопросы

Новые вопросы

javascript