重复相同的 div

Question

我想知道它是否因为在您的 HTML 中多次使用相同的 div id 或 class 而被人看不起。我在 HTML 中使用了 div id="col1" 和 div id="col2" 两次，我只是好奇这是否是可接受的格式，或者如果以这种方式编码有一些潜在的失败。

<div class="row1">
    <div id="col1" class="right">
    </div>
    <div id="col2" class="left">
    </div>
</div>
<div id="row2">
    <div id="col1" class="right">
    </div>
    <div id="col2" class="left">
    </div>
</div>

这个怎么样？

<div id="row1">
    <div class="col1">
    </div>
    <div class="col2">
    </div>
</div>
<div id="row2">
    <div class="col1">
    </div>
    <div class="col2">
    </div>
</div>

Answer 1

您不能使用相同的 ID 两次，因为 ID 属性应该是唯一的。

试试 div#row1_col1 和 div#row2_col1。

<div class="row1">
    <div id="row1_col1" class="right">
    </div>
    <div id="row1_col2" class="left">
    </div>
</div>
<div id="row2">
    <div id="row2_col1" class="right">
    </div>
    <div id="row2_col2" class="left">
    </div>
</div>

另一种方法是将列设为 class。您可以使用选择器访问一行的列：div#row1 div.col1

<div id="row1">
    <div class="col1 right">
    </div>
    <div class="col2 left">
    </div>
</div>
<div id="row2">
    <div class="col1 right">
    </div>
    <div class="col2 left">
    </div>
</div>

Answer 2

用这种方式编码肯定有缺点。

HTML 中的

id 通常用于 CSS 或 JQuery 以识别中的元素问题。

如果您以这种方式编写代码，您的其他代码将不容易提取这些元素。基本 HTML 标准是使用独特的 ids.

重复相同的 div

repeating the same div

html

tags

standards

repeat