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 петли, так что я 'd скорее не показывать это здесь :-).

Я хотел бы знать, что является более элегантным/идиоматическим (и, вероятно, более кратким) решением этой проблемы.

Answer 1

Вот DEMO: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, как это ...

Вот DEMO:http://jsfiddle.net/ZRukk/4/

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

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

Answer 2

Вы можете сделать это следующим образом:

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

Рабочий пример здесь: http://jsfiddle.net/jfriend00/DNWSm/

И, немного другой способ сделать это, что, вероятно, быстрее, потому что это, вероятно, менее 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(''); 

Рабочий пример: http://jsfiddle.net/jfriend00/bEBGQ/