Использование jquery для удаления всех элементов с заданным идентификатором - PullRequest
Новая
       2

Использование jquery для удаления всех элементов с заданным идентификатором

45 голосов
/ 19 ноября 2010

У меня есть форма с несколькими пролетами с id = "myid".Я хотел бы иметь возможность удалить все элементы с этим идентификатором из DOM, и я думаю, что jQuery - лучший способ сделать это.Я выяснил, как использовать метод $ .remove () для удаления одного экземпляра этого идентификатора, просто выполнив: 

$('#myid').remove()

, но, разумеется, удаляет только первый экземпляр myid.Как мне перебрать ВСЕ экземпляры myid и удалить их все?Я думал, что метод jquery $ .each () может быть подходящим, но я не могу понять синтаксис, чтобы перебрать все экземпляры myid и удалить их все.

Если есть простой способ сделать это с обычным JS (без использования jQuery), я тоже открыт для этого.Может быть, проблема в том, что идентификаторы должны быть уникальными (т.е. у вас не должно быть нескольких элементов с id = "myid")?

Спасибо,

Крис

Ответы [ 7 ]

65 голосов
/ 19 ноября 2010

.remove() должны удалить их все.Я думаю, проблема в том, что вы используете ID.На странице должен быть только один HTML-элемент с определенным идентификатором, поэтому jQuery оптимизирует и не ищет их всех.Вместо этого используйте класс .

39 голосов
/ 19 ноября 2010

Все ваши элементы должны иметь уникальные идентификаторы, поэтому не должно быть более одного элемента с # myid

«id» - это уникальный идентификатор. Каждый раз, когда этот атрибут используется в документе, он должен иметь другое значение. Если вы используете этот атрибут в качестве ловушки для таблиц стилей, может быть более целесообразно использовать классы (какие элементы группы), чем id (которые используются для идентификации только одного элемента).

Тем не менее, попробуйте это: 

$("span[id=myid]").remove();
14 голосов
/ 19 ноября 2010

идентификатор элемента dom должен быть уникальным.Вместо этого используйте класс (<span class='myclass'>).Чтобы удалить весь промежуток с этим классом: 

$('.myclass').remove()
7 голосов
/ 04 июня 2012

, если вы хотите удалить все элементы с совпадающими частями идентификатора, например: 

<span id='myID_123'>
<span id='myID_456'>
<span id='myID_789'>

попробуйте это: 

$("span[id*=myID]").remove();

не забывайте '*' - это удалит их всех сразу - ура

Рабочая демоверсия

6 голосов
/ 21 октября 2012

Вы должны использовать class для нескольких элементов, так как id должен быть только одним элементом.Чтобы ответить на ваш вопрос о синтаксисе .each(), он выглядит следующим образом: 

$('#myID').each(function() {
    $(this).remove();
});

Официальная документация JQuery здесь .

5 голосов
/ 31 декабря 2012

Самый простой способ сделать это - использовать селекторы html5 api, в частности querySelectorAll(). 

var contentToRemove = document.querySelectorAll("#myid");
$(contentToRemove).remove();

Функция querySelectorAll() возвращает массив элементов dom, соответствующих определенному идентификатору.После того, как вы присвоили возвращенный массив для var, вы можете передать его в качестве аргумента jquery remove().

0 голосов
/ 19 ноября 2010

Как уже говорилось, только один элемент может иметь определенный идентификатор. Используйте вместо этого классы. Вот jQuery-бесплатная версия для удаления узлов: 

var form = document.getElementById('your-form-id');
var spans = form.getElementsByTagName('span');

for(var i = spans.length; i--;) {
    var span = spans[i];
    if(span.className.match(/\btheclass\b/)) {
        span.parentNode.removeChild(span);
    }
}

getElementsByTagName - наиболее совместимый с браузером метод , который можно использовать здесь. getElementsByClassName будет гораздо лучше, но не поддерживается Internet Explorer <= IE 8. </p>

Рабочая демоверсия

...