jquery - 如何从一系列 创建数组

Question

如何从一系列 <span> 中创建一个数组？在特定的 <div>当点击 btn ？

<div class="btn">Make Arrays<div>

<div class="Wrapper">
  <div class="some elements"></div>
  <div class="Arrays">
    <input type="text" placeholder="enter value">
    <div>some stuff</div>
    <span>123.23</span>
    <span>52</span>
    <span>728.4</span>
    <span>52</span>
  </div>
</div>
<div class="Wrapper">
  <div class="some elements"></div>
  <div class="Arrays">
    <input type="text" placeholder="enter value">
    <div>some stuff</div>
    <span>10.8</span>
    <span>28.7</span>
  </div>
</div> ...

输出 var Array1 = ['123.23', '52', '728.4', '52'] var Array2 = ['10.8', '28.1'] ...

问题是，我不知道有多少class="Arrays"会是因为它是动态元素。所以也许应该有一种方法可以通过将像“Array1”、“Array2”这样的虚拟类添加到“class="Arrays"”中来对其进行索引

所以，基本上，我如何索引每个 <Arrays> div 并从其 <span> 中创建一个数组

非常感谢~~~ =)

Answer 1

这将返回数组的数组。

function getArray() {
  const arr = Array.from(document.querySelectorAll('.Arrays'))
    .map(a => Array.from(a.querySelectorAll('span')).map(span => span.textContent));

  console.log(arr)
}

<button onclick="getArray()">getArray</button>

<div class="btn">Make Arrays
  <div>

    <div class="Wrapper">
      <div class="some elements"></div>
      <div class="Arrays">
        <input type="text" placeholder="enter value">
        <div>some stuff</div>
        <span>123.23</span>
        <span>52</span>
        <span>728.4</span>
        <span>52</span>
      </div>
    </div>
    <div class="Wrapper">
      <div class="some elements"></div>
      <div class="Arrays">
        <input type="text" placeholder="enter value">
        <div>some stuff</div>
        <span>10.8</span>
        <span>28.7</span>
      </div>
    </div>