Маніпуляція з елементами jQuery. Частина 4

35

Від автора: вітаю вас, друзі. У цій статті ми продовжимо знайомитися з методами, що дозволяють здійснювати маніпуляції з елементами DOM, а саме: додавання, видалення і зміна елементів DOM.

В останній статті, присвяченій маніпуляції з елементами DOM в jQuery, ми розглянемо методи, які дозволяють видаляти елементи з DOM. Нагадаю, у попередніх статтях ми вивчали методи маніпуляції, які дозволяли додавати або змінювати елементи.

Отже, якщо нам потрібно вилучити якийсь елемент, ми можемо скористатися методом remove або detach. Обидва методу дадуть однаковий результат. Давайте подивимося на приклад:

  • Item 1
  • Item 2
  • Item 3
  • Item 1
  • Item 2
  • Item 3

$(‘.list1’).remove();
$(‘.list2’).detach();

Якщо тепер оновити сторінку, то ми побачимо, що блок content справді порожній, обидва списки були видалені.

Якщо нам необхідно видалити не сам елемент, а його вміст, тоді знадобиться метод empty. Спробуємо очистити вміст першого списку:

$(‘.list1’).empty();

Манипуляция с элементами в jQuery

І остання пара методів, які ми використовуємо в роботі, методи replaceWith і replaceAll. Як випливає з назв методів, їх призначення — замінювати одні елементи сторінки іншими. Наприклад, замінимо вміст обох наших списків на нове:

$(‘.list1 li’).replaceWith(‘

  • replaceWith
  • ‘);
    $(‘

  • replaceAll
  • ‘).replaceAll(‘.list2 li’);

    Манипуляция с элементами в jQuery

    На цьому ми завершимо поточну статтю і знайомство з jQuery методами маніпуляції в цілому. Більше про jQuerу ви можете дізнатися з наших уроків або курсу. Удачі!