Javascript getElementById（child分区id）与$（parentDiv）.attr（“child分区”）

我在页面上显示了许多不同的Div元素。 其中一些相互之间有一些关系：例如，一个附加在另一个上

我需要以平日的方式添加、删除和更新其中的许多内容， 因此，为了随时访问它们，我想到了两种选择：

为每个div指定唯一的ID，然后在需要时执行

getElementById

或者，提供尽可能少的ID，并通过其父级访问子div。为此，我必须这样做：

$(parentDiv).attr("child", childDiv), or $(parentDiv).data("child", childDiv)"

并使用以下命令获取子元素：

$(parentDiv).attr("child"), or $(parentDiv).data("child")

我的问题是，哪种方法更有效（哪种更快，哪种被认为是更好的设计，等等）

或者，提供尽可能少的ID，并通过其父级访问子div。为此，我必须这样做：$（parentDiv.attr（“child”，childDiv）或$（parentDiv.data（“child”，childDiv）”

并使用-$（parentDiv.attr（“child”）或$（parentDiv.data（“child”）获取子元素

这不是访问子元素或子元素的方式

我的问题是，哪种方法更有效（哪种更快，哪种被认为是更好的设计，等等）

这些可能是不同的问题。您不可能比通过

id

更有效地访问元素，但如果您的结构良好，那么这与从结构上查找元素之间的效率差异不大。您可以从几个定位点进行导航就足够了

很难提供一个完整的例子，而不需要更多关于结构的信息，但是让我们考虑一个典型的表格，您希望对单元格的点击作出响应：

<table>
<tbody id="foo">
<tr data-info="first row">
<td>One</td>
<td>Two</td>
<td>Three</td>
</tr>
<tr data-info="second row">
<td>One</td>
<td>Two</td>
<td>Three</td>
</tr>
</tbody>
</table>

---

为了更好的设计方法，尽量避免使用ID创建动态元素。如果您只是根据动态添加元素的需要创建css类，通常会简单得多，而且（调试起来）也容易得多

---

如果动态创建id，则必须始终确保给定id在页面上是唯一的，这将导致非平凡页面的复杂性。此外，IE和Chrome对非唯一id的处理方式不同（也取决于浏览器版本）这使得调试非常令人沮丧。

给元素一个类名，这样你可以将元素分组在一起，然后你可以使用jQuery直接访问它们。所以parent1下的任何东西都可以给parent1类等等

 $('.parent1').remove();  // will remove all parent1 classes

---

“getElementById（child\u div\u id）VS$（parentDiv）.attr（“child\u div”）“这些功能完全不同。你能更仔细地阅读我的帖子吗？@T.J.Crowder我想这里的目的是在每个元素上都有ID，或者通过将div的子元素列为属性来建立手动关系。@Nodarius:你能更仔细地阅读我的评论吗，求你了？@BrendanBullen:但这并没有减少ID的数量，这正是引入这些行的目的。将子ID作为属性放在父元素上仍然需要子元素具有ID。亲爱的T.J，感谢您的良好响应，但我的主要观点是：“通过列出子元素或（child_type1、child_type2，等等）在每个元素或手动关系上具有ID。”一个div的属性是什么？更详细的解释-我有7个主列作为天（如日历），具有唯一ID，在每个DayColumn上我有几个不同类型的div，每个DayColumn上只有1个。它们是-DayHeader、DayBody、DayBusyTime（可能更多）。我应该给每个div唯一的ID还是应该-$（DayColumn）.data（“dayHeader”，dayHeader）”？@Nodarius:啊，我明白你的意思了。我可能会给他们上课，然后通过

$（DayColumn）引用他们。找到（.dayHeader”）

，除非他们不是孩子。如果他们不是孩子，当然，使用

数据也没什么害处（不是
attr
）构建关系，尽管这只能在代码中而不是在标记中完成。
 $('.parent1').remove();  // will remove all parent1 classes