如何从属性中收集信息并将它们作为数组发送？答案

【问题标题】：How to collect info from attributes and send them as an array?如何从属性中收集信息并将它们作为数组发送？
【发布时间】：2018-03-16 19:36:01
【问题描述】：

我想创建一个 JavaScript 数组，其中包含 .user-status 类的用户 ID，以便使用 ajax 发送到 PHP。

这是我的 HTML：

<div class="user-status" data-userid="159"></div>
<div class="user-status" data-userid="221"></div>
<div class="user-status" data-userid="3321"></div>
<div class="user-status" data-userid="13112"></div>

这是我的 JavaScript：

$('.user-status').each(function() {
    $(this).attr('data-userid');
});

var users = ["", "", "", ""];

jQuery.ajax({
    url: ajaxURL,
    data: {
        action : 'user_status',
        usersid: users
    },
    dataType: 'JSON',
    type: 'POST',
    success: function (response) {

    }
});

直到这里我无法继续我无法使用户 id 的数组可以发送。

【问题讨论】：

Create an array from list of articles tag's data attribute 和 Create an array of objects by capturing a data attribute 的可能副本

标签： javascript jquery arrays ajax

【解决方案1】：

你可以这样做：

var users = [];
jQuery('.user-status').each(function() {
    users.push($(this).attr('data-userid');
});

我从一个空数组开始，否则你会得到一个包含 8 个项目的数组，其中四个是空字符串。

【讨论】：

【解决方案2】：

也可以使用jquery的data属性如

var users = [];

$('.user-status').each(function() {
    users.push($(this).data('userid'));
});

【讨论】：

【解决方案3】：

将用户 id 推入数组中。

$('.user-status').each(function() {
    users.push($(this).attr('data-userid'));
});

【讨论】：

【解决方案4】：

您可以将函数 map 与函数 $.toArray() 一起使用

var users = $('.user-status').toArray().map(function(elem) {
    return $(elem).data('userid');
});

【讨论】：

【解决方案5】：

使用Array.from可以避免创建空数组并推送。

console.log(Array.from($('.user-status'), function(element) {
return $(element).data("userid")
}))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="user-status" data-userid="159"></div>
<div class="user-status" data-userid="221"></div>
<div class="user-status" data-userid="3321"></div>
<div class="user-status" data-userid="13112"></div>

【讨论】：