jQuery предоставляет несколько методов, таких как empty(), remove(), unwrap()и т. д. для удаления существующих элементов HTML или содержимого из документа.

jQuery-метод empty()

jQuery-метод empty() удаляет из DOM все дочерние элементы, а также текстовое содержимое в выбранных элементах.

Следующий пример удалит все содержимое внутри элементов с классом .container по нажатию кнопки.

<script>
$(document).ready(function(){
    // Очищаем элемент с классом container
    $("button").click(function(){
       $(".container").empty();
    });
});
</script>

Согласно спецификации DOM W3C (World Wide Web Consortium), любая строка текста в элементе считается дочерним узлом этого элемента.

jQuery-метод remove()

jQuery-метод remove() удаляет выбранные элементы из DOM, а также все внутри него. В дополнение к самим элементам удаляются все связанные события и данные jQuery, связанные с элементами.

В следующем примере скрипт удалит все элементы <p> с классом .hint из DOM при нажатии кнопки. Вложенные элементы внутри этих абзацев также будут удалены.

<script>
$(document).ready(function(){
    // Удаляет абзацы с классом hint из DOM
    $("button").click(function(){
       $("p.hint").remove();
    });
});
</script>

jQuery-метод remove() также может включать селектор в качестве необязательного параметра, который позволяет фильтровать удаляемые элементы. Например, код удаления jQuery DOM предыдущего примера можно переписать следующим образом:

<script>
$(document).ready(function(){
    // Удаляет абзацы с классом hint из DOM
    $("button").click(function(){
       $("p").remove(".hint");
    });
});
</script>

Вы также можете включить выражение селектора в качестве параметра в jQuery-методе remove()), например, remove(".hint, .demo") для фильтрации нескольких элементов.

jQuery-метод unwrap()

jQuery-метод unwrap() удаляет родительские элементы выбранных элементов из DOM. Это обратный метод wrap().

В следующем примере будет удален родительский элемент элементов <p> при нажатии кнопки.

<script>
$(document).ready(function(){
    // Удаляем родительский элемент абзаца
    $("button").click(function(){
       $("p").unwrap();
    });
});
</script>

jQuery-метод removeAttr()

jQuery-метод removeAttr() удаляет атрибут из выбранных элементов.

Пример ниже удалит атрибут href из элементов <a> при нажатии кнопки.

<script>
$(document).ready(function(){
    // Удаляем атрибут href гиперссылки
    $("button").click(function(){
       $("a").removeAttr("href");
    });
});
</script>

Похожие посты

Руководство по синтаксису в jQuery

Оператор jQuery обычно начинается со знака доллара ($) и заканчивается точкой с запятой (;). В jQuery знак доллара ($) — это просто псевдоним для jQuery. Давайте рассмотрим следующий пример кода, который демонстрирует синтаксис кода на jQuery. Приведенный выше пример просто отображает предупреждающее сообщение «Hello World!» пользователю. Объяснение кода Давайте разберем приведенный выше пример подробнее. Тег…

Руководство по методу animate() в jQuery

jQuery-метод animate() используется для создания пользовательских анимаций. Метод animate() обычно используется для анимации числовых CSS-свойств, таких как width, height, margin, padding, opacity, top, left и т. д., Но нечисловые свойства, такие как color или background-color нельзя анимировать с помощью базовой функциональности jQuery. Не все CSS-свойства являются анимируемыми. Как правило, любое CSS-свойство, которое принимает значения в…

Руководство по callback-функциям в jQuery

Операторы JavaScript выполняются построчно. Но, поскольку для завершения эффекта jQuery требуется некоторое время, код следующей строки может выполняться, пока предыдущий эффект все еще выполняется. Чтобы этого не происходило, jQuery предоставляет функцию обратного вызова (Callback) для каждого метода. Функция обратного вызова — это функция, которая выполняется после завершения эффекта. Функция обратного вызова передается в качестве аргумента…

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.