Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   getElementsByTagName и parentNode.removeChild (https://javascript.ru/forum/dom-window/10839-getelementsbytagname-i-parentnode-removechild.html)

Vulkan 23.07.2010 18:53

getElementsByTagName и parentNode.removeChild
 
Приветствую, всех кто читает этот топик, какая-то хрень со связкой getElementsByTagName и parentNode.removeChild, в цикле почему то удаляет только по одному элементу, то есть надо вызвать цикл два раза чтобы удалить два элемента с такими тегами, простейший пример:
<script type="text/javascript">
function ulsdel(){
var UlList=document.getElementById('uls').getElementsByTagName('ul');
for(i=0; i<UlList.length; i++){
UlList[i].parentNode.removeChild(UlList[i])}
}
</script>
<div id="uls">
<ul><li>первый</li><li>первый</li><li>первый</li><li>первый</li></ul>
<ul><li>второй</li><li>второй</li><li>второй</li><li>второй</li></ul>
</div>
<input type="button" onclick="ulsdel()" value="Удалить UL">

Приходится нажимать кнопку два раза, чтобы удалить эти два тега ul, каждое нажатие удаляет один из них, а например если не parentNode.removeChild, а innerHTML, всё работает идеально, подскажите, пожалуйста, может есть тонкости с getElementsByTagName и parentNode.removeChild?

B@rmaley.e><e 23.07.2010 19:05

<script type="text/javascript">
function ulsdel(){
var UlList=document.getElementById('uls').getElementsByTagName('ul');
for(i=0; i<UlList.length; i++){
alert(UlList.length);
UlList[i].parentNode.removeChild(UlList[i])
alert(UlList.length);
}
}
</script>
<div id="uls">
<ul><li>первый</li><li>первый</li><li>первый</li><li>первый</li></ul>
<ul><li>второй</li><li>второй</li><li>второй</li><li>второй</li></ul>
</div>
<input type="button" onclick="ulsdel()" value="Удалить UL">

Vulkan 23.07.2010 19:30

Ааа, ну теперь понятно, тут счётчик должен не постинкрементироваться, а умножаться на 2:
<script type="text/javascript"> 
function ulsdel(){ 
var UlList=document.getElementById('uls').getElementsByTagName('ul'); 
for(i=0; i<UlList.length; i*2){ 
UlList[i].parentNode.removeChild(UlList[i]) 
} 
} 
</script> 
<div id="uls"> 
<ul><li>первый</li><li>первый</li><li>первый</li><li>первый</li></ul> 
<ul><li>второй</li><li>второй</li><li>второй</li><li>второй</li></ul> 
</div> 
<input type="button" onclick="ulsdel()" value="Удалить UL">

B@rmaley.e><e, спасибо

B@rmaley.e><e 23.07.2010 21:21

Лучше использовать обход в обратном порядке
<script type="text/javascript">
function ulsdel(){
var UlList=document.getElementById('uls').getElementsByTagName('ul');
for(i=UlList.length; i--;){
UlList[i].parentNode.removeChild(UlList[i])}
}
</script>
<div id="uls">
<ul><li>первый</li><li>первый</li><li>первый</li><li>первый</li></ul>
<ul><li>второй</li><li>второй</li><li>второй</li><li>второй</li></ul>
</div>
<input type="button" onclick="ulsdel()" value="Удалить UL">

Kolyaj 23.07.2010 22:13

Лучше все-таки innerHTML обнулять, но если сильно хочется, то обычный while

while (UlList.length) {
    UlList[0].parentNode.removeChild(UlList[0]);
}

Vulkan 24.07.2010 08:00

Kolyaj, дело в том что тут генерирующиеся менюшки в одном диве и в этом диве есть ещё и кнопки. поэтому если обнулять див то удалятся не только меню, а если создать для меню отдельный див скрипт начинает лагать, потому что я там уже всё четко подстроил, придётся несколько перестраивать, так что обнуление innerHTML не подходит, но за совет спасибо, буду использовать while.
B@rmaley.e><e, спасибо за помощь, тебе + не могу поставить так как вылазит ограничение на увеличение репутации, я тебе недавно ставил, поэтому система не даёт тебе повысить репу.

Добавлено спустя некоторое время:
while не работает когда в диве найден только один элемент.

float 24.07.2010 14:30

Цитата:

i=0; i<UlList.length; i*2
i*2=0(always)

Описание ситуации:
в уллисте 2 нода[0],[1].
В первом цикле удаляется [0]. i++(=1). В уллисте 1 нод[0]<=положение 2-го нода после удаления 1-го


Часовой пояс GMT +3, время: 22:50.