获取多个元素的文本作为数组

Question

所以我有一堆<a href="..." class="summary-sig-name">Some Text I Want</a>元素，我希望将所有的.text（）内容作为数组，以便我可以进一步处理它。

我已根据其他stackoverflow问题试过了：

classes = document.getElementsByClassName("summary-sig-name");
values = [];

for(var i = 0; i < classes.length; i++) {
    values.push(classes[i].value);
}

导致

var classes = document.getElementsByClassName("summary-sig-name"); // Do not use a period here!
var values = Array.prototype.map.call(classes, function(el) {
    return el.innerText;
});

导致

jQuery(".summary-sig-name").text()

导致 我非常接近我想要的但我无法猜测一个人的结局和下一个的开始

如果你想知道我要去哪个页面＆＃34;处理＆＃34;：https://pytson.4qt.de/ts3plugin.ts3plugin-class.html

Answer 1

忘记这些方法，你只需要使用each循环来获取元素text并将它们推送到这样的数组中：

＆＃13;

＆＃13;

textArray = [];

$('.summary-sig-name').each(function() {
  var text = $(this).text();
  textArray.push(text);
});

console.log(textArray);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="summary-sig-name">Some Text I Want 1</a>
<a href="#" class="summary-sig-name">Some Text I Want 2</a>
<a href="#" class="summary-sig-name">Some Text I Want 3</a>
<a href="#" class="summary-sig-name">Some Text I Want 4</a>
<a href="#" class="summary-sig-name">Some Text I Want 5</a>

＆＃13;

＆＃13;

＆＃13;

但是如果你想知道为什么那些不起作用，你应该innerText而不是value。

＆＃13;

＆＃13;

classes = document.getElementsByClassName("summary-sig-name");
textArray = [];

for (var i = 0; i < classes.length; i++) {
  textArray.push(classes[i].innerText);
}

console.log(textArray);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="summary-sig-name">Some Text I Want 1</a>
<a href="#" class="summary-sig-name">Some Text I Want 2</a>
<a href="#" class="summary-sig-name">Some Text I Want 3</a>
<a href="#" class="summary-sig-name">Some Text I Want 4</a>
<a href="#" class="summary-sig-name">Some Text I Want 5</a>

＆＃13;

＆＃13;

＆＃13;

对于第二个，它运作良好：

＆＃13;

＆＃13;

var classes = document.getElementsByClassName("summary-sig-name");
var textArray = Array.prototype.map.call(classes, function(el) {
  return el.innerText;
});

console.log(textArray);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="summary-sig-name">Some Text I Want 1</a>
<a href="#" class="summary-sig-name">Some Text I Want 2</a>
<a href="#" class="summary-sig-name">Some Text I Want 3</a>
<a href="#" class="summary-sig-name">Some Text I Want 4</a>
<a href="#" class="summary-sig-name">Some Text I Want 5</a>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果你想在jQuery中实现这一点，那么map()是迄今为止最简单的方法：

＆＃13;

＆＃13;

let textArray = $('.summary-sig-name').map(function() {
  return $(this).text();
}).get();

console.log(textArray);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<a href="#" class="summary-sig-name">Foo</a>
<a href="#" class="summary-sig-name">Bar</a>
<a href="#" class="summary-sig-name">Fizz</a>
<a href="#" class="summary-sig-name">Buzz</a>

＆＃13;

＆＃13;

＆＃13;

另请注意，您的第一个示例不起作用，因为您需要使用innerText属性，而不是value。第二个工作正常。