javascript - jQuery 选择器——更优雅的解决方案

Question

给定以下 HTML 片段:

<div class="word">
    <input type="text" name="A" />
    <input type="text" name="n" />
</div>
<div class="word">
    <input type="text" name="E" />
    <input type="text" name="x" />
    <input type="text" name="a" />
    <input type="text" name="m" />
    <input type="text" name="p" />
    <input type="text" name="l" />
    <input type="text" name="e" />  
</div>

我想编写一个 jQuery 脚本，将所有 ':text' 元素的名称连接到一个字符串中，同时在到达 ' 末尾时添加一个空格div.word' 元素。

例如，给定上面的 HTML，结果将是:

An Example

使用我(非常)有限的 jQuery/javascript 技能，我设法找到了一个解决方案，但它涉及肮脏的 for ... in 循环，所以我不想在这里展示它:-) .

我想知道这个问题的更优雅/惯用(并且可能更简洁)的解决方案是什么。

Answer 1

这是一个演示: http://jsfiddle.net/ZRukk/1/

var string = $('.word input').map(function() {
    var is_last = $(this).is(':last-child');
    return this.name + (is_last ? ' ' : '');
}).toArray().join('');

---

在现代浏览器中，你可以在没有 jQuery 的情况下这样做......

这是一个演示: http://jsfiddle.net/ZRukk/4/

var inputs = document.querySelectorAll('.word input');

var string = [].map.call(inputs, function(el) {
    return el.name + (!el.nextElementSibling ? ' ' : '');
}).join('');