2

根据 CSS 原则，当我们想要实现样式的可重用性时，我们应该使用class属性，当我们知道整个 DOM 结构中存在一个唯一元素时，我们应该id对该元素使用属性，然后指定样式。

但是在这个 Web 应用时代，DOM 结构可能过于复杂，存在重复的可能id。最好的例子是#title. 它的名称可以出现在文档的任何位置。现在最好的部分是如果我使用#title或.title在定义样式时（假设它们已经出现了不止一次并且具有不同的父级），CSS 生成的输出是相同的。这个 jsfiddle 将帮助您理解我的意思http://jsfiddle.net/dewbot/LGAQD/

我的印象是，就像 JS Renderer 一样，CSS Parser 在它第一次发现时会停止迭代，#title但它不会发生它会一直迭代直到它达到 EOF 就像class. 所以这就产生了一个问题，为什么我们应该使用 multipleclass而不是id？

4

4 回答 4

4

所以这就产生了一个问题，为什么我们应该使用 multipleclass而不是id？

因为 HTML 规范是这么说的，违反规则通常会导致代码损坏。

用同一个 ID识别多个元素有意义吗？我想不是。这就是类的用途：对相似的元素进行分类。

现在最好的部分是如果我使用#title或.title在定义样式时（假设它们已经出现了不止一次并且具有不同的父级），CSS 生成的输出是相同的。

这是自然行为，而不是任何本身执行此操作的浏览器中的错误。尽管如此，它不是您应该依赖的那种行为，因为它处理不符合标准的标记，这通常是不好的。

我的印象是，就像 JS Renderer 一样，CSS Parser 在它第一次发现时会停止迭代，#title但它不会发生它会一直迭代直到它达到 EOF 就像class.

现在这是错误的。CSS 解析器在每个元素的基础上进行选择器匹配：他们不采用规则并遍历 DOM 将其应用于匹配它的任何元素；相反，他们获取每个元素并尝试将其与尽可能多的规则进行匹配。以这种方式工作，解析器不知道ID 是否已在文档的其他地方使用，也不关心。它只是根据元素所说的进行匹配。这个答案更详细地介绍了它。

只要一个元素有一个特定的 ID，它就必须匹配任何寻找该特定 ID 的 ID 选择器。因此，解析器应该将具有给定 ID 的任何和所有元素匹配到单个 ID 选择器，即使在 HTML 中具有相同 ID 的多个元素是不正确的。换句话说，CSS 不强制要求 HTML 所要求的 ID 的唯一性。这个答案解释了。

综上所述，底线是：一次只为一个元素分配一个 ID，并使用类对多个相似元素进行分组。不要试图变得聪明和违反规则。

于 2012-03-24T07:57:30.270 回答
4

我认为您对 CSS 的解析错误。浏览器不会逐行遍历 CSS 文件并将样式应用于 HTML 文件中的元素，反之亦然。浏览器解析 HTML，每当它找到一个class或id属性时，它就会在 CSS 文件中查找它。（这非常简化，但有助于理解重点）。

仅仅因为如果您有多个ids 浏览器会正确呈现它并不意味着您应该这样做。该标准 明确规定id 必须是唯一的。

于 2012-03-24T07:59:53.357 回答
1

你已经自己回答了。

CSS 确实将它应用于它可以找到的所有ids 和classes。但是，JS/jQuery 会在它找到的第一个实现它。

所以，你的问题变成了：

我应该id对许多元素应用相同的 s 以进行 JS 操作吗？答案：Baaaaa....D 决定

我应该id对 CSS 的许多元素应用相同的 ' 吗？答：还是不好，决定！但会执行你的规则

您还应该尝试使用分层方式应用的 CSS 和 JS 规则，这样就永远不会出错。喜欢，#Heading div#Title{css rules here}或$('#Heading div#Titles')...jQuery rules here

接下来是尝试以保守的方式实现 id。

然后，尝试为您的网站/应用程序中的元素提供唯一 ID，而不是单个页面。这将使您免于包含在页面中的多页实用程序脚本。

例如：首页顶部的标题：#Home-Top-Heading

希望能帮助到你。

于 2012-03-24T08:04:55.763 回答
0

如果您在不止一个上使用相同的 ID，您的代码将无法通过验证

CSS 不关心多个 id，javascript 关心

http://css-tricks.com/the-difference-between-id-and-class/

于 2012-03-24T08:05:12.783 回答