javascript - 使用 jQuery 连接来自多个 HTML 元素的属性？

Question

我想创建一个字符串来表示容器中每个元素的名称，每个名称用逗号分隔。我想出了以下 jQuery 函数:

var list = "";

container.children("*").each(function()
    {
        if(list)
        {
            list += ",";
        }
        list += jQuery(this).data("item-name");
    });

我想知道在不使用 each() 函数的情况下是否有更有效/更简洁的方式来收集属性？

Answer 1

您可以使用 .map() method获取一个数组，然后用逗号连接项目:

var list = $('.element').children().map(function () {
  return $(this).data("item-name");
}).get().join(',');

基本示例:

var list = $('.element').children().map(function () {
  return $(this).data("item-name");
}).get().join(',');

document.body.textContent = list;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="element">
  <div data-item-name="name1"></div>
  <div data-item-name="name2"></div>
  <div data-item-name="name3"></div>
  <div data-item-name="name4"></div>
</div>