VPF::Удалить все div элементы - Форум программистов

4epT

Дата 1.2.2012, 14:08 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 784
Регистрация: 13.8.2007

Репутация: нет
Всего: 3

Здравствуйте! Имеется html страница, на которой N div элементов, у каждого может быть вложенный div. Наприем вот такая страница:

Код


<div>
</div>

<div>
         <div>
                  <div>
                  </div>
         </div>
</div>

<div>
</div>

Нужно нативным JS скриптом удалить эти дивы из DOM ...

Подскажите пожалуйста в какую сторону смотреть )

$дмитрий

Дата 1.2.2012, 18:34 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 19.6.2004

Репутация: 2
Всего: 45

Удалить на странице все div? Тогда примерно так

Код


<script>
        var d = document.body.getElementsByTagName('DIV');
        for(var i=0; i<d.length; i++)
        {
            document.body.removeChild(d[i]);
        }
        </script>

Amphiluke

Дата 1.2.2012, 18:45 (ссылка)

(нет голосов)

Загрузка ...

☽

Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 35
Всего: 112

Цитата($дмитрий @ 1.2.2012, 22:34

)

Тогда примерно так

Тут следует учесть, что родительским элементом div`а не обязательно является body. Такой скрипт потенциально способен выбросить исключение при попытке удалить чужой дочерний элемент.

Поэтому тело цикла должно быть примерно таким:

Код


d[i].parentNode.removeChild(d[i]);

Добавлено через 6 минут и 21 секунду
Более того, ваш код потерпит неудачу для случая нескольких рядом стоящих div`ов. Это связано с тем, что метод getElementsByTagName возвращает «живую» коллекцию, которая меняется «на лету» при удалении одного из элементов коллекции, так что инкрементирующийся счетчик цикла пропустит некоторые элементы:
Вот проверьте на такой конструкции:

Код


<div id="f1">
    <div>
        <div>

        </div>
        <div>
        </div>
     </div>
</div>

<div id="f2">
    <div>
        <div>

        </div>
        <div>
        </div>
     </div>
</div>

Добавлено через 10 минут и 20 секунд
Вот более стабильная реализация:

Код


var d = document.body.getElementsByTagName('DIV');
while (d.length > 0) {
    d[0].parentNode.removeChild(d[0]);
}

$дмитрий

Дата 1.2.2012, 19:25 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1037
Регистрация: 19.6.2004

Репутация: 2
Всего: 45

Все правильно пишешь, поддерживаю smile

4epT

Дата 1.2.2012, 22:59 (ссылка)

(голосов:1)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 784
Регистрация: 13.8.2007

Репутация: нет
Всего: 3

Вот так сделал =) Работает ... Но боюсь что на большом DOM будет долго работать

Код


var list = document.getElementsByTagName("div");
        
        do{
            for (var i = 0; i < list.length; i++) {
                (list[i].parentNode).removeChild(list[i]);
            }
            
            list = document.getElementsByTagName("div");
        } while(list.length > 0);

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »