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

时间:2022-03-28 09:13:37

Something like get an variable out of class.

有点像在课堂上得到一个变量。

ParentElement.someId.someId..

If i have something like that in css:

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

#someId #aaa #bbb
{
    ...
}

#someOtherId #aaa #bbb
{
    ...
}

and i want to get only the element under "#someId". Something like

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

getElementById("someId aaa bbb"); 

would be great, unfortunately this one doesn't work.

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

Any ideas?

4 个解决方案

#1


If you have given an id to the element, you can say

如果你给了元素一个id,你可以说

document.getElementById(childId)

Id must be unique in the document.

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

In your scenario, what I think you are having element with same Id at multiple places. Either you can user class instead of id.

在您的场景中,我认为您在多个位置具有相同Id的元素。您可以使用用户类而不是id。

#2


I assume you want to get the element in javascript, or what do you mean by "getting" in HTML?

我假设您想要在javascript中获取元素,或者您在HTML中“获取”是什么意思?

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

You can access a specific element by getElementById('box'); and you can access its children by getElementById('box').children. So the first child would be getElementById('box').children[0] for example.

您可以通过getElementById('box')访问特定元素;你可以通过getElementById('box')来访问它的子节点。所以第一个孩子将是getElementById('box')。例如,children [0]。

Did that help you ?

这对你有帮助吗?

#3


Id's are unique within the document so your ParentElement.someId.someId can simply be translated to document.getElementById(childId).

Id在文档中是唯一的,因此您的ParentElement.someId.someId可以简单地转换为document.getElementById(childId)。

Regarding the sample CSS you posted, please note that you cannot have both situations in the same HTML at the same time, you can stylise differently based on the DOM hierarchy though. With this in mind, you can use the same document.getElementById(childId) call.

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

#4


ID should be unique, so you really shouldn't have elements with the same ID over and over, instead you can use class.

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

To access the element though, first you get the parent:

要访问该元素,首先要获得父元素:

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

Then use querySelector on parent to get the desired element:

然后在父级上使用querySelector来获取所需的元素:

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

And if it's id then:

如果它是id,那么:

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

#1


If you have given an id to the element, you can say

如果你给了元素一个id,你可以说

document.getElementById(childId)

Id must be unique in the document.

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

In your scenario, what I think you are having element with same Id at multiple places. Either you can user class instead of id.

在您的场景中,我认为您在多个位置具有相同Id的元素。您可以使用用户类而不是id。

#2


I assume you want to get the element in javascript, or what do you mean by "getting" in HTML?

我假设您想要在javascript中获取元素,或者您在HTML中“获取”是什么意思?

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

You can access a specific element by getElementById('box'); and you can access its children by getElementById('box').children. So the first child would be getElementById('box').children[0] for example.

您可以通过getElementById('box')访问特定元素;你可以通过getElementById('box')来访问它的子节点。所以第一个孩子将是getElementById('box')。例如,children [0]。

Did that help you ?

这对你有帮助吗?

#3


Id's are unique within the document so your ParentElement.someId.someId can simply be translated to document.getElementById(childId).

Id在文档中是唯一的,因此您的ParentElement.someId.someId可以简单地转换为document.getElementById(childId)。

Regarding the sample CSS you posted, please note that you cannot have both situations in the same HTML at the same time, you can stylise differently based on the DOM hierarchy though. With this in mind, you can use the same document.getElementById(childId) call.

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

#4


ID should be unique, so you really shouldn't have elements with the same ID over and over, instead you can use class.

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

To access the element though, first you get the parent:

要访问该元素,首先要获得父元素:

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

Then use querySelector on parent to get the desired element:

然后在父级上使用querySelector来获取所需的元素:

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

And if it's id then:

如果它是id,那么:

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