Question

我有一个事件，我需要在具有匹配类名的元素中添加一个类。例如：

<a class="one"></div>
<a class="two"></div>

<div class="one"></div>
<div class="two"></div>

如何在具有匹配类名的元素中查找并添加其他类？这是我的脚本，我需要它来匹配带有匹配类的标记。

jQuery('div.two').waypoint(function(direction) {
  if (direction === 'down') {
    jQuery(this).addClass("active") // to <a> element that shares same class
  }
  else {
  }
});

Answer 1

我不熟悉这个插件，但我会试一试。根据您提供的内容，我认为您的问题是：

jQuery(this).addClass("active")

既然你已经知道了这个课程，那就去做：

var tempClass = $(this).attr("class");
jQuery("a."+tempClass).addClass("active");

Answer 2

只需按类名选择。

Array.prototype.forEach.call(document.querySelectorAll(".one"), function(el) {
    el.classList.add("whateverClass");
});

而不是for循环，它使用原型方法forEach和call方法将NodeList转换为数组列表，将类添加到类“one”的每个元素

DEMO

Answer 3

您可能希望先从其他类中删除该类，然后添加到适用的<a>

jQuery('div.two').waypoint(function(direction) {
  if (direction === 'down') {
     /* remove prior active class */
     jQuery("a.active").removeClass('active');
     /* add to current one */
     jQuery("a.two").addClass('active');
  }
  else {
  }
});

为了使这更通用，我会向所有内容元素添加类似waypoint的类以及data-point以便能够简化实例。

<div data-point="one" class="waypoint"></div>

JS

jQuery('.waypoint').waypoint(function(direction) {
  if (direction === 'down') {
     /* remove prior active class */
     jQuery("a.active").removeClass('active');
     /* add to current one */
      var linkClass=$(this).data('point')
     jQuery("a." + linkClass).addClass('active');
  }
  else {
  }
});

使用Waypoints将jQuery addClass添加到具有相同类名的元素

3 个答案: