javascript - 从属性中获取所有值并推入数组

Question

我有一个名为“位置”的属性的 div 容器。在这个位置是由半冒号分隔的国家的选择。我想获取这些值中的每一个并将它们作为单独的项目推送到一个数组中，而不是一个带有分号的长字符串。

<div class="item-container" location="United States; United Kingdom; France"></div>

有一次，我有这些我想对它们进行排序，但是，前半部分是最重要的。

感谢任何帮助。

Answer 1

var element = document.querySelector('.item-container');
var locations = element.getAttribute('location').split('; '); // ["United States", "United Kingdom", "France"]
locations.sort(); // ["France", "United Kingdom", "United States"]

如前所述，您可以重命名并使用location来访问该字符串（IE 10+）。data-locationelement.dataset.location

Answer 2

我建议您data-为自定义属性使用前缀，即

HTML：

<div class="item-container" data-location="United States; United Kingdom; France"></div>

HTML5 数据属性。

JS：

var div = document.querySelector('[data-location]');
var arr = div.getAttribute('data-location').split(';').sort();
console.log(arr); // [" France", " United Kingdom", "United States"] 

演示。

Answer 3

使用 jQuery：http: //jsfiddle.net/3ma9m/

var str = $('.item-container').attr('location');
var n = str.split(";");

$.each(n, function (key, value) {
    $('.item-container').append(key + ": " + value + "<br />");
});