JQuery从列表中获取所有数据属性

Sid*_*how 22 javascript jquery jquery-selectors

我有一个长动态生成的列表,每个列表具有相同的类标识符和类似于下面的代码的数据属性:

<ul>
    <li class="list" data-id="123">One</li>
    <li class="list" data-id="124">Two</li>
    <li class="list" data-id="125">Three</li>
    <li class="list" data-id="126">Four</li>
    .....etc
</ul>
Run Code Online (Sandbox Code Playgroud)

我想要实现的是获取所有data-id值并将其格式化如下:

123|124|125|126....etc
Run Code Online (Sandbox Code Playgroud)

然后,这将通过ajax传递给页面,并检查id是否存在于数据库中.

var delimited_data="";
$('.list').each(function(){
    delimited_data+=$(this).data('id')+"|";
});
console.log(delimited_data);
Run Code Online (Sandbox Code Playgroud)

我问这个问题的原因是我正在开发一个实时系统,它可以在10分钟后自动将列表列中的项目部署到不同的用户.我只需要确保代码正确的方式:)

我还需要检查.list页面上是否没有类(即 - 无法进行查询)是否delimited_data完全为空,我很确定它会是.

有没有比.each()在这种情况下使用更好的方法,因为我发现它可能相当缓慢,因为上述功能将每30秒运行一次.

tym*_*eJV 52

您可以.map用来返回一个数组:

var dataList = $(".list").map(function() {
    return $(this).data("id");
}).get();

console.log(dataList.join("|"));
Run Code Online (Sandbox Code Playgroud)

演示:http://jsfiddle.net/RPpXu/


YD1*_*D1m 5

用这个:

var array = [];

$('li.list').each(function() {
  array.push($(this).data('id'));
})

var joined = array.join('|');
Run Code Online (Sandbox Code Playgroud)