javascript - 如何通过悬停或鼠标悬停同时更改多个(至少两个)不同跨度或div的突出显示颜色？

我正在处理有时具有彼此相关的不同部分的文本内容，我想让用户将鼠标悬停/鼠标悬停在任何相关部分上，并因此以相同的突出显示部分同时突出显示所有相关部分颜色。

假设在将内容生成为HTML之前，我确实（在服务器上）具有与哪些部分相关的所有信息，这是最快的方法。即我可以放入适当的CSS或javascript，以按页面为基础临时获得所需的设置。

最佳答案

最快的方法是在您的身体或顶部容器元素上切换一个类，并以对其后代进行彩色/突出显示等方式定义CSS。这比在关联中的每个元素中添加/删除类要快。

例如：如果所有相关元素都具有“ rel-1”类，则可以具有如下CSS定义：

body.rel-1 .rel-1 {
    background-color: #ddd;
    /* .. other styles */
}

然后将鼠标悬停在任何具有类rel-1的元素上，即可在body / container元素中切换相同的类。

例如：

$('.rel-1').mouseover(function() {
    $(body).addClass('rel-1');
});

$('.rel-1').mouseout(function() {
    $(body).removeClass();
});

等等..

关于javascript - 如何通过悬停或鼠标悬停同时更改多个(至少两个)不同跨度或div的突出显示颜色？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/12364232/