从具有公共属性的html元素列表到其值的数组？

Question

给出HTML等

<span class="L5" letters="a"></span>
<span class="L5" letters="b"></span>
<span class="L5" letters="c"></span>
<span class="L5" letters="d"></span>
<span class="L5" letters="e"></span>

如何返回数组： var list = [＆＃39; a＆＃39;，＆＃39;＆＃39;＆＃39; c＆＃39;，＆＃39; d＆＃39;＆＃39; e＆＃39; ];

我尝试了$(".L5").attr("letters"); without success (jsfiddle)。

Answer 1

您需要获取具有该类类型的元素数组，然后将其属性字母值推送到新数组中。

let list= [];
let spanElements = $('.L5');

for(let x =0; x < spanElements.length; x++){
    list.push($(spanElements[x]).attr('letters'));
}

Answer 2

Ryan的回答肯定会用jQuery完成。但是，我不确定你将以这种方式解析多少元素，如果性能很重要，你可以使用Array.from()和map()

在没有jQuery的情况下完成同样的事情。

var list = Array.from(document.getElementsByClassName('L5')).map(function (element) {
    return element.attributes.letters.nodeValue
});

Fiddle with console.time()

Answer 3

您可以将jQuery.map()与jQuery.attr()

结合使用

代码：

＆＃13;

＆＃13;

const list = $('.L5').map((index, elem) => $(elem).attr('letters')).get();

console.log(list);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="L5" letters="a"></span>
<span class="L5" letters="b"></span>
<span class="L5" letters="c"></span>
<span class="L5" letters="d"></span>
<span class="L5" letters="e"></span>

＆＃13;

＆＃13;

＆＃13;