javascript - 如何在其他标签的 标签上创建相同的鼠标悬停行为？

Question

当您将鼠标悬停在 <a> 上时Chrome 中的标签浏览器读取“href”并在左下角显示链接。我可以在不使用<a>的情况下模仿这种行为吗？标签？

例如在这种情况下 <a>标签仅使每行上的文本可点击，并且您必须执行一些 hacky css 才能尝试使其接近整行点击。

<table>
  <tr onClick="goToLink()">
    <td>test</td>
    <td>test2</td>
  </tr>
</table>

我注意到，当您将鼠标悬停在电子邮件 ListView 中的电子邮件上时，gmail 没有标签悬停行为。

我的假设是有一个浏览器事件，我可以调用它来模拟这个事件，但我似乎找不到任何关于此的文档。

Answer 1

要达到您想要的效果，您只需将想要可点击的元素包装在带有 href 的 anchor 标记中即可。例如，我已将这个蓝色 div 包装在 anchor 标记中，现在整个蓝色 div 都是可点击的，并在浏览器左下角显示链接:

.clickable-div {
  height: 100px;
  width: 100px;
  background-color: blue;
}

<a href="https://stackoverflow.com">
  <div class="clickable-div"></div>
</a>