Прочитать id каждого элемента на странице.

Ogalig · June 17, 2008

Приветствую камрады. Задача состоит в том чтобы узнать id каждого элемента. Ничего лучше не придумал чем пробежать по всему дереву и спросить у каждого элемента его id. Для чего собственно написал вот такой алгоритм:

<script language="javascript" type="text/javascript">
var el=document.getElementById('btnButton1');
//alert(el.charAt(0)+el.charAt(1)+el.charAt(2));



var elem=document.body;//текущий элемент
//alert(document.getElementById('btnButton1').parentNode.parentNode.tagName);
find()


function find()
{


 if(elem.firstChild!=null)
 { 
 elem=elem.firstChild;
 alert(elem.getAttribute('id')+elem.tagName);
 find();
 }

 else
 { 
 [b] if(elem.nextSibling!=null)
 { 
 elem=elem.nextSibling;//Проблема где-то здесь не может идентифицировать тег.
 alert(elem.tagName+" "+elem.parentNode.innerHTML);
 find();
 }[/b]

 else
 {
 if(elem.parentNode.nextSibling!=null)
 { 
 elem=elem.parentNode.nextSibling;
 alert(elem.getAttribute('id')+elem.tagName);
 find();
 }

 else
 {
 findParent();
 alert(elem.getAttribute('id')+elem.tagName);
 find();
 } 
 }
 }
 }


function findParent()
{//alert('findParent');
 elem=elem.parentNode;
 if(elem.nextSibling!=null)
 {//alert('elem.nextSibling!=null');
 elem=elem.nextSibling; 
 }

 else
 { //alert('elem.nextSibling==null'); 
 findParent();
 }
} 
</script>

код самой страницы:

<body>
 <form id="form1" runat="server">
 <div id="fg">
 <asp:Button ID="btnButton1" runat="server" Text="Button" />
 <asp:Button ID="Button1" runat="server" Text="Button" />
 <table>
 <tr id="t1"><td><div><asp:Button ID="btnButton2" runat="server" Text="Button" /></div></td></tr>
 <tr id="t2"><td><asp:Button ID="btnButton3" runat="server" Text="Button" /></td></tr>
 </table>
 <asp:Button ID="btnButton4" runat="server" Text="Button" />
 <div><asp:Button ID="btnButton5" runat="server" Text="Button" /></div>
 </div>
 </form>
</body>

проблема в том что когда он доходит до выделенного вот этого фрагмента:

if(elem.nextSibling!=null)

{

elem=elem.nextSibling;//Проблема где-то здесь не может идентифицировать тег.

alert(elem.tagName+" "+elem.parentNode.innerHTML);

find();

}

то пишет что elem.tagName unindefened из-за чего не работает вся остальная часть скрипта. 2-й день уже бьюсь над этой проблемой просто, и чувствую что хожу по кругу, а решения все найти не могу.

yopopt · June 17, 2008

А зачем такое-то? Может проще написать как-то так:

<script type="text/javascript">
var find = function(id) {
 var output = '';
 var node = (typeof id == 'undefined' ? document.getElementsByTagName('body')[0] : document.getElementById(id)).getElementsByTagName('*');
 for(var i=0; i<node.length; i++) {
 if(node[i].getAttribute('id')) output += node[i].getAttribute('id') + "n";
 }
 return output;
}

window.onload = function() { alert(find()); }
</script>

Посмотрите как этот небольшой пример работает с вашим HTML-кодом.

Ogalig · June 17, 2008

Здорово работает, спасибо

Ogalig · June 18, 2008

Не могли бы вы объяснить вот эту строку. Я пока недостаточно грамотен в программировании чтобы понять ее

var node = (typeof id == 'undefined' ? document.getElementsByTagName('body')[0] : document.getElementById(id)).getElementsByTagName('*');

yopopt · June 18, 2008

Эта строка написана для того, чтобы можно было пройтись по id не только внутри body, но и внутри блока с каким-то id. Например вызывая функцию find с аргументом "fg" в Вашем коде Вы получите все id внутри блока "fg":

btnButton1
Button1
t1
btnButton2
t2
btnButton3
btnButton4
btnButton5

var node = (typeof id == 'undefined' ? document.getElementsByTagName('body')[0] : document.getElementById(id)).getElementsByTagName('*');

В принципе эта строка не нужна. Попробую расписать.

(typeof id == 'undefined' ? document.getElementsByTagName('body')[0] : document.getElementById(id))

если id не определ?н (не указан), тогда нас интересуют элементы внутри body, в противном случае - внутри элемента с этим id. Сама конструкция условие ? действие : действие называется условным тернарным оператором и представляет из себя упрощ?нную запись if(условие) { действие } else { действие }.

.getElementsByTagName('*')

Просто все теги.

Ogalig · June 18, 2008

Спасибо. Буду знать

Sign In

Прочитать id каждого элемента на странице.

Question

Ogalig

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

yopopt

Link to comment

Share on other sites

Ogalig

Link to comment

Share on other sites

Ogalig

Link to comment

Share on other sites

yopopt

Link to comment

Share on other sites

Ogalig

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information