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

给定以下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/javascript技能，我设法找到了一个解决方案，但它涉及到肮脏的

。。。在

循环中，所以我不想在这里显示它：-）

---

我想知道解决这个问题的更优雅/惯用（可能更简洁）的方法是什么。

您可以这样做：

var result = [];
$('.word').each(function() {
    $(this).find('input').each(function() {
        result.push(this.name);
    });
    result.push(' ');
});
var answer = $.trim(result.join(''));

此处的工作示例：

还有一种稍微不同的方法，可能更快，因为它可能更少进行DOM搜索：

var result = [];
var lastParent;
$('.word input').each(function() {
    // if starting a new parent, add a word separator
    if (lastParent && lastParent != this.parentNode) {
        result.push(' ');
    }
    result.push(this.name);
    lastParent = this.parentNode;
});
var answer = result.join('');

这里的工作示例：

这里有一个演示：

---

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

这里有一个演示：

---

这只需要

文本

输入吗？@ajax333221:如果问题中的代码反映了实际代码，那么是的，因为这是唯一的输入类型。如果不是，则为否，需要在选择器中指定它。

var result = [];
var lastParent;
$('.word input').each(function() {
    // if starting a new parent, add a word separator
    if (lastParent && lastParent != this.parentNode) {
        result.push(' ');
    }
    result.push(this.name);
    lastParent = this.parentNode;
});
var answer = result.join('');

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

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

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