jQuery: Konvertiere alle vier LI in einen

Question

Ich arbeite an einem Schieberegler, wo ich alle vier LI in einen LI konvertieren will.

Der Schieberegler zeigt eine LI mit vier Elementen zu der Zeit an. Ich möchte, dass der Inhalt SPANs in einem LI enthalten ist.

Von: (ein SPAN pro LI)

<li><span>#Content</span></li> 
<li><span>#Content</span></li> 
<li><span>#Content</span></li> 
<li><span>#Content</span></li> 
<li><span>#Content</span></li> 
<li><span>#Content</span></li> 

... in: (vier SPAN pro LI)

<li><span>#Content</span><span>#Content</span><span>#Content</span><span>#Content</span></li> 
<li><span>#Content</span><span>#Content</span></li> 

Ich kann keine Informationen im Internet zu finden scheinen über diese Technik. Was soll ich machen?

Macht es Sinn? Tut mir leid, mein schlechtes Englisch ...

Answer 1

Sie können Schleife durch mit .slice() und .wrapAll() wie folgt aus:

var spans = $("li span").unwrap(); 
for(var i = 0; i < spans.length; i+=4) { 
    spans.slice(i, i+4).wrapAll("<li />"); 
} 

You can test it out here. Was dies tut, ist .unwrap(), um die ursprünglichen <li> Wrapper zu entfernen, dann Schleifen durch Einsätze von 4, verwendet .slice(), um das Set wir arbeiten mit (es wird richtig behandelt die letzten 4 oder weniger) und .wrapAll() auf diese <span> Elemente zu erhalten Legen Sie sie in eine neue <li>.

Answer 2

Fetch-Gehalt von 4 li und concatinate Inhalt in einzelne li Versuchen Sie create_html.js (Plugin) verwenden li erstellen effizient