html table自动序号,javascript – 如何在HTML表中获取自动序列号列

纯CSS解决方案

HTML :(一个带有空白td的简单表格,用于保存计数器)

Automatic Serial numberColumn 1Column 2

Column 1Column 2Column 1Column 2Column 1Column 2Column 1Column 2Column 1Column 2Column 1Column 2Column 1Column 2Column 1Column 2

CSS：

body

{

counter-reset: Serial; /* Set the Serial counter to 0 */

}

table

{

border-collapse: separate;

}

tr td:first-child:before

{

counter-increment: Serial; /* Increment the Serial counter */

content: "Serial is: " counter(Serial); /* Display the counter */

}

如果你想要定位特定的表,只需给它一个类,并专门针对那些trs.

HTML

.

.

.

CSS

.auto-index td:first-child:before

{

counter-increment: Serial; /* Increment the Serial counter */

content: "Serial is: " counter(Serial); /* Display the counter */

}