Удаление элементов одного класса (myclass) на странице

У меня возникла необходимость написать функцию Javascript удаления всех элементов одного класса. По своей сути это удаление всех узлов DOM с одинаковым классом (например class=”myclass”). Хоть и поиском
элементов в DOM по классу пользоваться не любят, но у меня был, похоже, только такой выбор. А как я решила проблему с реализацией скрипта в IE вы можете прочитать в статье getElementsByClassName кроссбраузерно Удаление узла DOM в JavaScript осуществляется с помощью метода removeChild, который удаляет элемент из его родителя. Синтаксис:

elem.removeChild(child)

Удаление элементов на странице одного класса и последующая их группировка

Исходные данные: В HTML документе есть один общий <div id=”my class””> . Внутри его располагается ряд дивов, который мне нужно сгруппировать (в примере в две группы). Ни к внешнему общему диву, ни к его внутренним детям доступа с помощью HTMLнет. Была возможность создать дополнительные внутренние дивы и присвоить им разные классы: myclass1 и myclass2. С помощью которых группы и можно идентифицировать. Вот как это выглядит:

Логика:
Так как элементов на странице с одинаковым классом предположительно много удаление элементов происходит с помощью цикла:

  • Если элемент с заданным классом встречается впервые – вывести Называние группы;
  • Найти элемент по классу;
  • Определить родителя найденного элемента по классу – parent;
  • Удалить parent(со всем содержимым);
  • Вставить parent (со всем содержимым);

Parent удаляется с общего списка, а вставляется уже после выведенного на странице Названия группы.

Попробовать в редакторе


Подпишитесь на RSS канал - если Вы хотите первыми узнавать о новых статьях на сайте!!!

Статьи по теме:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *