css - 页面上的唯一 HTML ID

Question

我经常在表格上有以下内容：

input#userid{
    left : 10px;
    top:130px;
    width : 180px;
}

label#userid{
    left : 10px;
    top:156px;
}

我知道页面上的 id 应该是唯一的，并且一直认为上述内容是唯一的。但是，现在我正在阅读有关“标签”的内容，并想知道我的 ID 在 HTML 精神中是否真正独一无二。

score 0 · Accepted Answer

没有。ID 在文档中应该是唯一的，在所有元素中都是唯一的。是的，您可以使用非唯一 ID，但这不是一个好主意。

根据经验，如果您发现自己想在两个元素上使用相同的 ID，您应该考虑改用类。在上面的具体示例中，您可以将输入字段userid同时作为类和 ID，并仅将其用作标签的类。

或者，您可以使用 CSS 属性选择器来定位 CSS 中的标签：

input#userid{
  left: 10px;
  top 130px;
  width: 180px;
}

label[for="userid"]{
  left: 10px;
  top: 156px;
}

...假设您for在标签上分配了属性。

score 0 · Accepted Answer

在浏览器世界中，假设您的 HTML 中有两个具有相同 ID 的元素，它可能会起作用。但是，该 HTML 不会验证，可能会破坏各种类型的 HTML 处理器，并且可能工作或不工作，具体取决于浏览器和/或文档类型。另请参阅html 中的唯一 id 值。

2 回答 2