Question

有一条书面（多次）规则，即 #id 选择器将唯一元素标识为DOM树。

接下来总是得出结论只有一个 #id 的单独元素可以存在于DOM树中。

因此，如果你需要为一种在DOM树中出现另一种元素的元素使用CSS选择器，你必须使用 .class 选择器。

好吧，我对这种限制也有一些疑问，我认为这并没有回应真正的需求并避免更直观地使用 #id 和 .class 选择器

问题：

现有chain selectors喜欢'＃id1＃id2'我能理解＃id2 最好是唯一的＃id1 context，但强迫＃id2 在整个DOM上下文中应该是唯一的意义？

这条规则只会助长 id 无意义命名的堕落地狱。还迫使我们过度使用 class 属性。

我觉得更容易避免这个规则和构建这样的结构，（请理解代码是简化的，而不是在建议中使用具体的HTML结构）：

<div id="armys" class="list">
  <div id="1" class="element">
    <div id="orders" class="text">My orders</div>
    <div id="soldiers" class="list">
      <div id="1" class="element">
        <div id="name" class="text">John</div>
      </div>
      <div id="2" class="element">
        <div id="name" class="text">Esther</div>
      </div>
    </div>
  <div>

  <div id="2" class="element">
    <div id="orders" class="text">My orders</div>
    <div id="soldiers" class="list">
      <div id="3" class="element">
        <div id="name" class="text">Smith</div>
      </div>
    </div>
  <div>
</div>

这是一个非常自然的结构翻译：

armys: [
  {
    id: 1,
    orders: "My orders",
    soldiers: [
      {
        id: 1,
        name: "John"
      },
      {
        id: 2,
        name: "Esther"
      }
    ]
  },
  {
    id: 2,
    orders: "My orders",
    soldiers: [
      {
        id: 3,
        name: "Smith"
      }
    ]
  }
]

Answer 1

你没有正确接近这个。类和ID属性不适用于CSS，也不适用于JavaScript。它们旨在识别和分类不同的元素。

唯一元素获取一个ID，它具有CSS和JavaScript的优点，以及本机浏览器行为（如果单击匹配的锚链接，则跳转到ID）。

意义相似的元素获得共享类名。这有助于在CSS和JavaScript中对它们进行分类（HELPS！），以便更好地分组相似的元素。

此外，仅供参考，有不同的元素代表无序列表和列表项，因此您不会在不必要的div中填充页面。

CSS选择器非规范化

1 个答案: