Question

我有一些HTML代码，我无法使用javascript编辑。我试图访问的DIV是具有ID的另一个孩子的孩子：

<div id="contentcolumn">
    <div class ="content content_gray"></div>
    <div class ="forum_tabs"</div>
</div>

我尝试访问的DIV是"content content_gray"类的DIV。我不想使用该类访问它，因为其他元素具有此类。我必须通过访问ID为“contentcolumn”的DIV的第一个孩子来访问它。

Answer 1

我必须通过访问ID为“contentcolumn”的DIV的第一个孩子来访问它。

你的意思是这样吗？

var elm = document.getElementById("contentcolumn").firstElementChild;

你说这是第一个孩子，所以我没有费心去检查className，但是如果你愿意，当然可以。您可以通过执行以下操作添加该检查：

if (elm.className.match(/\bcontent\b/) && elm.className.match(\bcontent_gray\b)) {
    // ...
}

请注意，并非所有浏览器都有firstElementChild。（例如，我不确定IE8是否会这样做。）对于那些不这样做的人，一个简单的循环就可以了（甚至可以在那些拥有它的人身上运行）：

var elm = document.getElementById("contentcolumn").firstChild;
while (elm && elm.nodeType !== 1) {
    elm = elm.nextSibling;
}

你可以使用一个小实用程序库：

function firstElementChild(parent) {
    var node = parent && parent.firstElementChild;
    if (!node && parent) {
        node = parent.firstChild;
        while (node && node.nodeType !== 1) {
            node = node.nextSibling;
        }
    }
    return node;
}

您在下面询问了如何在元素设置后设置元素id。那部分很简单：

elm.id = "value";

Answer 2

检查每个document.getElementById（“contentcolumn”）的element.className.getElementsByTagName（“div”）

或者，jQuery（“＃id＆gt; .class”）看起来更简单

将ID添加到元素的子元素

2 个答案: