Javascript 如何使用jquery突出显示表中的行

我有一个简单的jquery脚本来突出显示悬停时的DOM元素。但是这个脚本没有突出显示我的表中的行，单元格没有问题

在我的脚本中，我需要能够选择任何类型的元素，而不仅仅是表，因此我不能基于表选择编写解决方案，例如。有什么建议吗

$document.readyfunction{ $body.on'mouseover'，functionevent{ var highlightTarget=$event.target； highlightTarget.addClasshighlight； }.on'mouseout'，functionevent{ $event.target.removeClass'highlight'； }; }; .亮点{ 边框：1px纯绿色； 背景色：暗绿色； z指数：99999； } 梅因先生{ 边框顶部：1px实心9EBACF； 边框底部：1px实心FFFF； 左边框：1px实心9EBACF； 右边框：1px实心FFFF； } 猫先生{ 边框顶部：1px实心FFFF； 边框底部：1px实心9EBACF； 左边框：1px实心FFFF； 右边框：1px实心9EBACF； } } 数据1 数据2 数据3 数据4 数据5 数据6

---

使用CSS的一种方法是使用：hover选择器

.hoverable:hover {
    background: rgba(150, 150, 150, 0.5);
}

类.hoverable的所有元素都将突出显示。请注意，在下面的示例中，将鼠标悬停在第一行时，和都会高亮显示。在第二行中，仅高亮显示，而在第三行中，仅高亮显示

.可悬停：悬停{ 背景：rgba180，180，180，0.5； } 数据1 数据2 数据3 数据4 数据5 数据6 思维方式 在每个元素上绑定鼠标事件。 为要考虑父元素的元素创建映射。 现在，在悬停状态下，只需检查map是否具有此元素类型的值。 如果是，则获取父选择器并导航到它。 如果不是，则使用当前元素作为默认元素。 从任何其他元素中删除类 将类添加到存储的元素。 注意：第6步是必需的，因为您将有一个div。这个div将有一个表，并一直持续到td，但您只想访问当前元素，而不是所有元素

样品 $document.readyfunction{ 创建悬停 }; 函数createHover{ 常数映射={ TD:tr } $document.on'mouseenter mouseout'，'*'，function e{ var myClass=突出显示 var parent=map[this.nodeName]； var$this=$this var el=$this； $'.+myClass.removeClassmyClass 如果父母{ el=$this.closestparent } el.toggleClassmyClass，$this.is:悬停 e、 停止传播 } } .亮点{ 边框：1px纯绿色； 背景色：暗绿色； } 梅因先生{ 边框顶部：1px实心9EBACF； 边框底部：1px实心FFFF； 左边框：1px实心9EBACF； 右边框：1px实心FFFF； } 猫先生{ 边框顶部：1px实心FFFF； 边框底部：1px实心9EBACF； 左边框：1px实心FFFF； 右边框：1px实心9EBACF； } 边缘案例 数据2 数据3 数据4 数据5 数据6 这是一个测试 这也是一种考验

---

您不需要JS，简单的css悬停即可：

.cat:hover{
  border: 1px solid green;
  background-color: darkseagreen;
  z-index: 99999;
}

---

你不需要。突出显示任何一个

请发布你的突出显示css。js提琴会很有帮助。为什么不使用tr:hover？另外，JSFiddle的链接不正确：-pEdit:addingJSFiddle@Rajesh：是否有一个通用的解决方案，而不仅仅是基于元素测试？因为我悬停的元素可以是div，li。。。等等，所有结构化数据元素。当突出显示a或a时，您的预期输出是什么？与John Bupit相同：我必须处理未知结构。谢谢。基本结构？你能解释一下吗？如果我跟着你，在createHover函数中，我必须键入我将遇到的元素。但这是不可能的，因为我事先不认识他们。正如CBroe所说，我只需要提供两种情况：一种是有父元素的元素，如td，另一种是没有父元素的元素，如div或li。@Didiermaccormick请检查更新。注意，这将对性能产生一些影响，因为我无法提供底层结构。我必须处理一个未知的结构。