getElementById не работает на узле

В этом простом сценарии я получаю сообщение об ошибке «obj.parentNode.getElementById не является функцией», и я понятия не имею, что не так.

<script type="text/javascript">

        function dosomething (obj) {
         sibling=obj.parentNode.getElementById("2");
         alert(sibling.getAttribute("attr"));
        }

</script>

<body>
 <div>
  <a id="1" onclick="dosomething(this)">1</a>
  <a id="2" attr="some attribute">2</a>
 </div>
</body>

person Ursus Russus    schedule 10.10.2010    source источник


Ответы (3)


.getElementById() находится на document, например:

document.getElementById("2");

Поскольку идентификаторы должны быть уникальными, нет необходимости в методе, который находит элемент по идентификатору относительно любого другого элемента (в данном случае внутри этого родителя). Кроме того, они не должны начинаться с цифры при использовании HTML4, числовой идентификатор допустим в HTML5.

person Nick Craver    schedule 10.10.2010
comment
Таким образом, несмотря на то, что getElementById часто описывается вместе с другими методами DOM как применимый к любому узлу, на самом деле он применим только к документу. Хорошо, спасибо. - person Ursus Russus; 11.10.2010

замените .getElementById(id) на .querySelector('#'+id);

person kernowcode    schedule 15.03.2017

document.getElementById() не будет работать, если узел был создан на лету и еще не присоединен к основному документу.

Например, с Ajax не все узлы подключены в любой точке. В этом случае вам нужно либо явно отслеживать дескриптор каждого узла (как правило, это лучше для производительности), либо использовать что-то вроде этого для просмотра резервных копий объектов:

function domGet( id , rootNode ) {
    if ( !id ) return null;

    if ( rootNode === undefined ) {

        // rel to doc base
        var o = document.getElementById( id );
        return o;

    } else {

        // rel to current node
        var nodes = [];
        nodes.push(rootNode);
        while ( nodes && nodes.length > 0 ) {
            var children = [];
            for ( var i = 0; i<nodes.length; i++ ) {
                var node = nodes[i];
                if ( node && node['id'] !== undefined ) {
                    if ( node.id == id ) {
                        return node; // found!
                    }
                }

                // else keep searching
                var childNodes = node.childNodes;
                if ( childNodes && childNodes.length > 0 ) {
                    for ( var j = 0 ; j < childNodes.length; j++ ) {
                        children.push( childNodes[j] );
                    }
                }
            }
            nodes = children;
        }

        // nothing found
        return null;
    }
}
person Kevin Seifert    schedule 19.10.2012