Как получить все теги под тегом Div с помощью JavaScript в Mozilla

Question

function handle_node(entity)
{
    var i = 0;

    var varName = window.event.srcElement.name.substring(0,7);
    var fieldValue = window.event.srcElement.value;
    var fieldName;
    // traverse thru all the products in the family
    for(i=0; i < entity.childNodes.length; i++)
    {
        if(entity.childNodes(i).tagName == "DIV")
        {
            handle_child_node(entity.childNodes(i))
        }
    }
}

function handle_child_node(entity)
{
    var it = 0;
    var oObject = entity.all;

    if (oObject != null)
    {
        if (oObject.length != null)
        {
            for (it = 0; it < oObject.length; it++)
            {
                if (oObject(it).tagName == 'INPUT' && oObject(it).attributes["type"].nodeValue == 'checkbox')
                {
                    resetTextFieldValue(window.event.srcElement, oObject(it));
                }
            }
        }
    }
}

Приведенный выше код отлично работает в IE. Но это не работает для Mozilla. Затем я изменяю код, указанный ниже. Но он не получает теги под тегом div. Какие изменения могут заставить код работать на Mozilla?

  function handle_node(entity)
        {
            var i = 0;
        if (entity.hasChildNodes())
        {
         children= entity.childNodes;
        for(i=0; i < children.length; i++) {

          var sibling= children[i];

                if(sibling.tagName == "DIV") {

           var elms = document.getElementsByTagName(sibling);
              handle_child_node(sibling)
                }
            }
        }
        }

        function handle_child_node(entity)
        {
         alert("entity"+entity);
            var it = 0;
            var oObject = entity.all;
           if (oObject != null)
            {
               if (oObject.length != null)
                {
                    for (it = 0; it < oObject.length; it++)
                    {
                       if (oObject(it).tagName == 'INPUT' && oObject(it).attributes["type"].nodeValue == 'checkbox')
                       {
                            resetTextFieldValue(window.event.srcElement, oObject(it));
                       }
                  }
              }
            }
    }

В строке handle_child_node(sibling) правильно? И я думаю, что var oObject = entity.all; не работает.

Answer 1

Ваш handle_node функция выглядит как обработчик событий в подмножестве / надмножестве MicroSoft ECMAScript (JScript). К счастью, модель событий является основным источником проблем с кодом в X-браузере. Ваш код выглядит для меня как типичный JScript. Взгляните на статьи о событиях в режиме quirksmode, чтобы лучше понять / понять различия.
А пока вот что вы должны знать:

JScript не передает экземпляр объекта события обработчику, а глобальный объект - window - имеет свойство под названием event тогда как все остальные браузеры передают объект события обработчику. Как правило, вы увидите, что обработчики выглядят так:

document.getElementById('foo').onclick = bar;//bar is handler
function bar(e)
{
    e = e || window.event;//use passed event instance, or get event property for IE
    var element = e.target || e.srcElement;//the reference to the DOM element is assigned to another property in JScript
    //a lot of stuff
    if (e.preventDefault)
    {//w3c's events are "controlled" with these methods
        e.preventDefault();
        e.stopPropagation();
    }
    e.returnValue = false;//IE's jScript, but W3C engines have these properties, too
    e.cancelBubble = true;
}

Что означают эти методы и свойства (если вы не знаете) - это то, о чем вы можете прочитать в quirksmode.
Вкратце: ваш код работает в IE, потому что вы используете свойства, которые ссылаются на узлы DOM в JScript, и вы предполагаете, что объект события является глобальной ссылкой, но это не так в FF, Chrome/Chromium, Safari, Опера... Так что вам нужно сначала решить эту проблему.

После этого, чтобы получить все дочерние узлы внутри div, вам не нужно children собственность вообще. Более того: вы не должны полагаться на это свойство: движок Mozilla будет перечислять пробелы как дочерние. Вот список ссылок на детей и различия X-браузера.

По сути, все, что вам действительно нужно сделать, это:

var children = divReference.getElementsByTagName('*');

И вы получите NodesList объект со всеми ссылками, которые вам когда-либо понадобятся...

Answer 2

Как насчет этой идеи

    function FindTags() 
        {
            var childDiv = document.getElementById("yourdiv").childNodes;
            for (i = 0; i < childDiv.length; i++) 
            {
                if (childDiv[i].tagName == "A") 
                {
                    childDiv[i].style.display = "block";
                }
                if (childDiv[i].tagName == "SPAN") 
                {
                    childDiv[i].style.fontWeight = "normal";
                }
//and so on for all tags you can do any thing
            }
        }

Надеюсь, что это помогает. Наслаждайтесь