javascript - 是否应该向 HTML 文档添加类或 id 以获得更好的结构？

Question

通常我们为 CSS 和 Javascript 选择器添加idor 。class当不需要选择器时，我们应该不放idorclass吗？

例子：

# HTML
<div class="name">John Smith</div>
<div class="email>jsmith@abc.com</div>

# CSS
.name { color: red }

你看那个.email没用。我们应该保留它，还是删除它？最佳做法是什么？

Answer 1

切勿将 ID 或类添加到您的 HTML 中，除非它们的存在有特定原因，例如深度链接到 ID、添加高级样式或 JavaScript 挂钩。

Answer 2

ID ro 类几乎没有区别，因为您在谈论更好的结构。

它们是用于设置每个元素的视觉呈现样式的选择器。如果您从该站点阅读有关 css 的 wiki 文章：您会发现唯一的区别是重要性或我们称之为Selector Precedence的内容，您可以在此处阅读：

https://stackoverflow.com/tags/css/info

选择器是这样的：

ID --> 类 --> 元素（从重要的 DESC 顺序）

另外，如果你不打算在 CSS 中使用它们，请尽量不要使用它们，我的意思是不要只使用 ClassNames 或 IDs 来告诉这个 div 是这样的：

<div class="email">username@example.com</div>

但是使用这个：

<div>username@example.com</div>

相反，仅在您要设置样式、更改字体大小、字体系列或其他视觉效果时才尝试使用 CSS。

Answer 3

该类不做任何事情，因此不需要它。浏览器读取它并减慢它（几乎没有），但它仍然没用。

在我看来，最好的做法是不要开设不需要的课程，而是给自己写一条评论。如果您的代码很长/您在一段时间后阅读它，评论可能会帮助您理解它。

<div>jsmith@abc.com</div> <!-- This is the user's email address -->

Answer 4

除非您打算使用它，否则不要将 Id 和类添加到您的 HTML。

注意：仅将 ID 用于不同的元素。对公共元素使用类，即，如果您想为公共元素应用样式，请选择类。