在HTML中获取元素的孩子的最佳做法是什么？

Question

像在课堂上获得变量一样。

ParentElement.someId.someId..

如果我在css中有类似的东西：

#someId #aaa #bbb
{
    ...
}

#someOtherId #aaa #bbb
{
    ...
}

我想只获得“#someId”下的元素。 像

这样的东西

getElementById("someId aaa bbb"); 

会很棒，不幸的是这个不起作用。

有什么想法吗？

Answer 1

如果你给元素id，你可以说

document.getElementById(childId)

  

ID必须在文档中是唯一的。

在您的场景中，我认为您在多个位置使用相同Id的元素。您可以使用class代替id。

Answer 2

我假设你想在javascript中获取元素，或者你在HTML中“获取”是什么意思？

<div id="box">
    <div>Child element</div>
    <div>Child element</div>
</div>

您可以getElementById('box');访问特定元素，然后按getElementById('box').children访问其子级。所以第一个孩子就是getElementById('box').children[0]。

这对你有帮助吗？

Answer 3

ID在文档中是唯一的，因此您的ParentElement.someId.someId可以简单地翻译为document.getElementById(childId)。

关于您发布的示例CSS，请注意您不能同时在同一HTML中同时使用这两种情况，但您可以根据DOM层次结构进行不同的样式设置。考虑到这一点，您可以使用相同的document.getElementById(childId)电话。

Answer 4

ID应该是唯一的，因此您实际上不应该反复使用具有相同ID的元素，而是可以使用class。

要访问元素，首先要获得父元素：

var parent = document.getElementById("someId");

然后在parent上使用querySelector来获取所需的元素：

var element = parent.querySelector('.ELEMENT_CLASS');

如果它是id，那么：

var element = parent.querySelector('#ELEMENT_ID');