如何为HTML表格行指定链接名称？

Question

我有一个表，每行都解释了一些东西（输入命令）。在另一个地方，我正在说从这个状态使用那个输入命令，你会到达另一个状态。我想做的是将那个输入命令链接到表格的相应行。想象一下这样的情况：

...link to row number <a href="#row2">2</a>...

<table ...>
    <tr>
        <td>command</td>
        <td>description</td>
    <tr>
    <tr>
        <a name="row1"></a>
        <td>A</td>
        <td>input A</td>
    <tr>
    <tr>
        <a name="row2"></a>
        <td>B</td>
        <td>input B</td>
    <tr>
</table>

正如您所看到的，我尝试在<tr>块中放置一个<a name="row2"></a>，但这并没有起作用（它将我带到了表格顶部）。

我想做的事情是否可能？

- Shahbaz

Answer 1

你可以采用以下两种方式之一：

1) 设置<tr>元素的id属性。<tr id="row2">...</tr>

或者

2) 将 <a> 元素放置在 <td> 元素内。如果你将任何元素放置在<table> 中但不是在<th>或<td>中，它会在整个表格渲染之前显示（尝试使用任何元素，浏览器会尽力修复无效的HTML）。

- J. Holmes

---

第一种方法完美地运作了。快问一下，如果你在任何标签中放置 id，那么它是否总是在该位置创建一个锚点？还是只有在 tr 中才会这样？ - Shahbaz

任何元素的id都可以用作锚点。我认为这项功能是在HTML 4.01中引入的，而使用<a name='anchor'></a>作为锚点在HTML5中已被标记为过时。（参考链接：http://www.w3.org/TR/html4/struct/links.html#h-12.2.3和http://www.w3.org/TR/html5/obsolete.html） - J. Holmes

第一种技术完美运作！第二种技术存在问题，有些表格框的顶部可能不会出现，特别是如果它们高度不同且锚点不在最高框的顶部。 - PhilHarvey

Answer 2

<tr>
    <td><a name="row2"></a></td>
    <td>B</td>
    <td>input B</td>
<tr>

- aus

---

这会在我的表中创建一个额外的列。 - Shahbaz

@Shahbaz 是的，事实上第一个 td 是空的。我认为 aus 的意思是 <td><a name="row2"></a>B</td>。 - ADTC

Answer 3

你可以创建一个“虚拟”锚定行：

<table ...>
    <tr>
        <td>command</td>
        <td>description</td>
    <tr>
    <tr>
        <td colspan="2" style="height: 1px;"><a name="row1"></a></td>
    <tr>
    <tr>
        <td>A</td>
        <td>input A</td>
    <tr>
    <tr>
        <td colspan="2" style="height: 1px;"><a name="row2"></a></td>
    <tr>
    <tr>
        <td>B</td>
        <td>input B</td>
    <tr>
</table>

如果您的表格有样式（边框、背景等），这可能是可见的，但您始终可以将这些行样式化为分隔符或伪装它们。

- Surreal Dreams

Answer 4

虽然对我来说不太直观，但我把<a name="row2"></a>放在第一个<td>块中，它就起作用了！

- Shahbaz

---

<tr>中不包含任何内容，除了<td>（如果在<thead>内，则为<th>）。基本上，除了<td>之外的任何尝试放入其中的内容都会被忽略。您只能将内容放入<td>元素中。 - evan

虽然这个方法可行，但问题是链接会把我带到单元格文本的顶部而不是整行的顶部。因此，如果有多行文本的单元格都垂直居中，它会把我带得太远，以至于更大的单元格几乎一半的文本行看不到。 - Shahbaz

没错 - 你不能直接在<tr>标签内放置<a>标签。据我所知，<tr>标签内唯一允许的标签是<td>。 - Surreal Dreams

一个<tr>元素应该拥有一个或多个<th>或<td>子元素。 - J. Holmes