javascript - 使用从 href 获得的 ID 数组来定位元素

Question

我遇到了以下代码无法按预期工作的问题。我试图通过将 anchor 标记 href 保存到数组中来从内容表中获取页面上的 ID 数组。该数组的构造符合我的预期，但是当我尝试将其用作目标元素时，没有任何反应。我怀疑这是因为数组被转换为字符串(从 console.log 中也可以看出)，但我仍然不太明白为什么它不起作用。我是否必须将数组转换为对象，如果是，如何完成？我在任何地方都找不到任何对我有意义的东西。

编辑:我必须这样做(最好至少)，因为内容表是动态创建的(始终不是相同的元素)，而内容中的元素指向的表应相应地设置样式。

var elements = [];
$(".bb").each(function() {
  elements.push($(this).attr("href"));
});
console.log(elements);

$(elements).each(function() {
  $(this).css("background", "red");
});

// This works for a single elment, however
var el = $(".cc").attr("href");
$(el).css("background", "green");

 body {
  padding-bottom: 100px;
 }
div {
  height: 50px;
  margin-bottom: 10px;
  background: #d3fcff;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="aa"></div>
<div id="xx"></div>

<a class="bb" href="#aa">target #aa</a>
<a class="bb" href="#xx">target #xx</a>

<p>Not using an array and targeting a single element works however</p>
<div id="zz"></div>
<a class="cc" href="#zz">target #zz</a>

Answer 1

var elements = [];
$(".bb").each(function() {
  elements.push($(this).attr("href"));
});
console.log(elements);



$.each(elements, function(i,val) {


  $(val).css("background", "red");
});

div {
  height: 50px;
  margin-bottom: 10px;
  background:#fff9d3;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="aa"></div>
<div id="xx"></div>

<a class="bb" href="#aa">target #aa</a>
<a class="bb" href="#xx">target #xx</a>

<p>Not using an array and targeting a single element works however</p>
<div id="zz"></div>
<a class="cc" href="#zz">target #zz</a>

因为你想得到你创建的数组的元素，而不是dom元素/对象，你可以使用:

$.each(elements, function(i,val) {


  $(val).css("background", "red");
});

通过 $(val) - 您创建 jQuery 对象，您的脚本将运行。

通知差异:http://api.jquery.com/jquery.each/和 http://api.jquery.com/each/