在Javascript中为ID's数组添加类

Add Class to Array of ID's in Javascript

本文关键字：数组 添加 Javascript 中为 ID      更新时间：2023-09-26

我使用。map来获取具有'default-highlight'类的元素id数组(命名为' IDs ')。在mouseenter上删除该类后，我想将该类返回给那些特定的id(基本上，保留我找到它的方式)。

现在有两件事正困扰着我:

  1. 当我动态地添加数据id到td元素，然后使用这些数据id来创建数组的'id '我的mouseenter停止添加'HIGHLIGHT'类(不知道为什么会发生这种情况)
  2. 在mouseleave上，我不能循环'ids'并将'default-highlight'类返回到它们最初在
    3. 上的元素

我想我应该使用这样的东西，但它显然不起作用:

$.each(ids, function() {
   $(this).addClass('default-highlight');
});

我试了很多方法，但总是失败。我正在附上一个链接到一个codepen。

在这里，我使用正在动态添加到表的数据id(这个鼠标输入不起作用)和一个相互依赖的，我使用常规id作为默认高亮，一切似乎都像它应该是(它不是，因为我想使用动态生成的数据id，然后随后产生的数组重新应用这些类)。

这两个依存关系的顶部都有一个gif，显示交互应该如何工作。

如果有什么不清楚的，请告诉我。感谢阅读!

您需要在id选择器前添加# 

$.each(ids, function() {
   $('#'+this).addClass('default-highlight');
});

或者可以借助map()和join()使用通用选择器

$(ids.map(function(i, v) {
  return '#' + v;
}).join()).addClass('default-highlight');

或者您可以在获得id时添加#，然后您只需要将它们连接起来

var ids = $('.default-highlight').map(function(i) {
  return '#'+$(this).data('id');
}).get();
...
...
...
$(ids.join()).addClass('default-highlight');

当您可以直接存储对jQuery元素的引用时，似乎存储id并使用这些id是多余的:

$highlightCells = $('.default-highlight').removeClass('default-highlight')

然后再返回class:

$highlightCells.addClass('default-highlight')

这是一个相互依赖的分支:http://codepen.io/anon/pen/ZbOvZR?editors=101

使用方法:

$.each(ids, function() {
   $("#" + this).addClass('default-highlight');
});
相关文章：