Javascript 基于当前悬停的类将CSS应用于具有相同类的多个元素

我在一个页面上有多个具有匹配类的元素。这些类是由一个变量构建的，所以我不能将css硬编码到样式表中。组成页面的元素将不断变化，因此我需要一些javascript来找到元素的类，然后为该类应用一些css。它位于一个带有Jquery、Drupal（视图）的站点上，如果这有帮助的话

我是这条路的一部分。我编写了以下脚本：

$(document).ready(function(){
$("a").hover(function() {
   var myClass = $(this).attr("class");
   $(.$myClass).hover(function(){
      $(this).css({
      border : '3px solid red',
      color : 'red'
      });
   });
});
});

现在，如果我在那里放一个“警报”，我看到它正在捕获当前悬停在上面的元素的类。但是我不能让它找到页面上所有的元素，并应用css。为了添加一些信息，我尝试调整的两个元素是一个小缩略图，我想在其周围添加边框，以及我想更改颜色的链接节点的标题

---

非常感谢您的帮助。

您遇到的问题是双重的（至少），但实际上您是在声明变量：

var myClass =  $(this).attr("class");

然后尝试使用不同的名称访问该变量，

$myClass

，该名称应为：

$(.myClass)

此外，选择器的句点不是变量名的一部分，它是一个字符串，因此必须引用并连接：

$('.' + myClass)

此外，您并没有在这些元素的悬停处为这些其他元素指定行为，而是在当前悬停的

a

元素的悬停处指定行为。那么你的

$("a").hover(function() {
   var myClass = $(this).attr("class");
   $(.$myClass).hover(function(){
      $(this).css({
      border : '3px solid red',
      color : 'red'
      });
   });

应该是：

$("a").hover(function() {
   var myClass = $(this).attr("class");
   $('.' + myClass).css({
      border : '3px solid red',
      color : 'red'
      });
   });

---

元素只有一个类名吗？是的。每个元素都通过viewlink[nid]获取其类，因此它们显示为viewlink1或viewlink2等。在这种情况下，使用本机DOM方法：

var myClass=this.className它更容易阅读，所需输入更少，运行更快。我只是尝试了一下，但没有成功。没有应用任何css。如果锚点位于其他div中，会影响它吗？请显示一个重现您的问题的锚点，因为我不明白为什么它不起作用（至少目前不起作用）。更改了“var myClass=this.className；”所以我看到,；因为这应该和你已经在做的事情一样（但是更快），所以除了提高效率之外，它不应该改变任何事情。请发布一个。我以前从未使用过JS小提琴，所以我不知道这是否有用，但是。。。