javascript - 如何将节点列表中的 HREF 属性分配给常规数组？

Question

正如您在下面的代码中看到的那样，downloadLinks变量是 <a> 的节点列表元素，我需要获取 href 属性并将它们分配到 linkContainer 数组中。 for 循环根本不起作用。我做错了什么？

谢谢!

( () => {

    "use strict";

    // Variables holding content to show & hide

    const tab1 = $("#default"),
          tab2 = $("#dim"),
   featureList = $("#default-wac-feature-list"),
 downloadLinks = document.querySelectorAll("#dropdown-download-links > li > a"),
 linkContainer = [];

  for(let i = 0; i < downloadLinks.length - 1; i++) {
      linkContainer[] = downloadLinks[i].href;
  }

  console.log(linkContainer);


}) ();

Answer 1

使用 i < downloadLinks.length而不是 i < downloadLinks.length - 1 ，并将链接分配给索引 - linkContainer[i] (或使用 Array.push )。

const downloadLinks = document.querySelectorAll("#dropdown-download-links > li > a"),
      linkContainer = [];

for (let i = 0; i < downloadLinks.length; i++) {
  linkContainer[i] = downloadLinks[i].href;
}

console.log(linkContainer);

<ul id="dropdown-download-links">
  <li><a href="1">1</a></li>
  <li><a href="2">2</a></li>
  <li><a href="3">3</a></li>
</ul>

一个更简单的选择是使用 Array.from()将 NodeList 直接转换为 href 数组:

const downloadLinks = document.querySelectorAll("#dropdown-download-links > li > a");

const linkContainer = Array.from(downloadLinks, el => el.href);

console.log(linkContainer);

<ul id="dropdown-download-links">
  <li><a href="1">1</a></li>
  <li><a href="2">2</a></li>
  <li><a href="3">3</a></li>
</ul>