立即获得第一个子元素

时间:2012-05-06 22:03:13

标签: javascript dom

我正在编写一个Chrome内容脚本扩展程序,我需要能够定位一个特定元素,遗憾的是,该元素除了其父元素外没有唯一标识符。

我需要定位parentElement的第一个子元素。 console.log(parentElement)完美地报告了两个子元素/节点,但是后续的控制台日志(以childNodes为目标的日志)始终返回undefined值,无论我做什么。

到目前为止,这是我的代码
(我已经排除了实际名称以避免混淆和额外的,不必要的解释)

function injectCode() {

    var parentElement = document.getElementsByClassName("uniqueClassName");

    if (parentElement && parentElement.innerHTML != "") {

        console.log(parentElement);
        console.log(parentElement.firstElementChild);
        console.log(parentElement.firstChild);
        console.log(parentElement.childNodes);
        console.log(parentElement.childNodes[0]);
        console.log(parentElement.childNodes[1]);

    } else {

        setTimeout(injectCode, 250);
    }   
}

如何选择parentElement的第一个子元素/节点?

enter image description here

更新
parentElement.children[0]也有与parentElement.childNodes[0]相同的错误。

1 个答案:

答案 0 :(得分:98)

这两个都将为您提供第一个子节点:

console.log(parentElement.firstChild); // or
console.log(parentElement.childNodes[0]);

如果您需要第一个子元素作为元素节点,请使用:

console.log(parentElement.children[0]);

修改

啊,我现在看到你的问题; parentElement是一个数组。

如果您知道getElementsByClassName只会返回一个结果,您似乎应该返回一个结果,那么您应该使用[0]将这个元素变为混淆(是的,我将这个单词提升了):

var parentElement = document.getElementsByClassName("uniqueClassName")[0];