[javascript] zliczanie elementów w divie

Witam.

Chcę zliczyć elementy diva w celu poóxniejszego dodania do niego elementu z unikalnym id, już pokazuje kod:

 
function dodaj(){

	var element = document.createElement('input');
	element.setAttribute('type', 'file');
	var liczba = 0;
	var ilosc = document.forms['formularz_dane_podstawowe'].elements.length;
   
    for (var i = 0; i < ilosc; i++ ){
       if (document.forms['formularz_dane_podstawowe'].elements[i].type == 'file'){
          liczba += 1;
       }
    }

	element.setAttribute('name', 'zalacznik_'+(liczba+1));
	document.forms['formularz_dane_podstawowe']. appendChild(element);

}

Działałem wcześniej w ten sposób, jednak teraz w moim formularzu jest dodatkowo parę divów i innych elementów przez co po dodaniu inputa na końcu formularz wygląda fatalnie.

Stworzyłem więc w formularzu diva w którym umieściłem input type="file", niestety nie mogę w podobny sposób (jak w powyższym przykładzie), dostać się do elementów diva.

Jak uzyskac cos takiego: var ilosc = document.divs['inputy_file'].elements.length;

Wiem ze to nie ma racji bytu ale napisałem ta linijkę żeby każdy wiedział o co mi chodzi :)

Z góry dzięki za pomoc :)

Na rzecz każdego elementu możesz wywołać metodę getElementsByTagName(nazwaTaga), która zwróci listę wszystkich elementów o tagu nazwaTaga (np. 'div', 'input' itd.) znajdujących się wewnątrz elementu, na rzecz którego wywołałeś funkcję.

Czyli jeśli masz:

var divZawierający = document.getElementById('inputy_file');
var inputy = divZawierajacy.getElementsByTagName('input');
alert('Liczba znalezionych inputów: ' + inputy.length);

To inputy będą zawierały listę wszystkich elementów input w elemencie #inputy_file. To są wszystkie elementy input: dowolnie głęboko zagnieżdżone. Czyli #inputy_file może zawierać jeszcze jakiegoś diva czy paragraf w środku, a w nim może być jakiś input i on również zostanie policzony.

Zwrócona lista ma własność length, w której zapisany jest rozmiar listy -- czyli ilość elementów.

Ty jednak piszesz w poście, że chcesz znaleźć WSZYSTKIE elementy, nie tylko elementy input. Spoko: do funkcji getElementsByTagName zamiast nazwy taga możesz przekazać gwiazdkę '*'. Wtedy zwrócone zostaną wszystkie elementy o dowolnych tagach. I tu również możesz użyć length.

IMO tak będzie najprościej, ale nie wiem czy zadziała to we wszystkich przeglądarkach, o które dbasz (szczególnie chodzi o starsze IE).

Jak nie to, to zostaje jQuery lub rekurencyjne przetwarzanie drzewa dokumentu.

Dzięki dokładnie o to mi chodziło :)