javascript - 获取迭代列表的所有值

Question

如何将数组/列表的所有值放入一行？

html示例代码:

<div class="projects">
   <span clas="project_title"> project1 </span>
   <span clas="project_title"> project2 </span>
</div>

如果我想获取跨度的值，我必须使用它

document.querySelectorAll('div.projects span.project_title')[0].textContent

---

结果:

project1

---

document.querySelectorAll('div.projects span.project_title')[1].textContent

---

结果:

project2

---

是否有任何简单的 JS 查询，以便无需迭代到列表即可获取此结果？

结果示例:

project1, project2

---

Answer 1

没有迭代就无法获得所有这些。但这种迭代可以在幕后完成。您可以使用Array#map 获取textContents。在这种情况下，您需要迭代 HTMLElements，这是在 Array#map 的底层完成的。 。

const spans = document.querySelectorAll('div.projects span.project_title');
const texts = Array.prototype.map.call(spans, item => item.textContent);

console.log(texts);

<div class="projects">
   <span class="project_title"> project1 </span>
   <span class="project_title"> project2 </span>
</div>