2012-10-10 18 views
5

Diese Schleife (siehe jsfiddle) versucht, einen Container fünfmal mit einem <span>-Tag zu versehen. Aber es tut es nur einmal. Warum?Warum wird das nur einmal angehängt?

var myArr = [0,1,2,3,4]; 
var $span= $('<span></span>'); 
for (var i = 0; i < (myArr.length); i++) { 
    $('.contain').append($span); 
} 
+0

nicht sicher, warum, aber es funktioniert, wenn Sie Linie 2 bis 'var Span = " SPAN" ändern;'. – nickdos

+0

Interessant, habe ich dies auf meinem (viel komplizierter als diese Demo) Code getestet, und der Vorschlag im obigen Kommentar funktioniert. z.B. Anfügen einer Zeichenfolge anstelle eines jQuery-Objekts. Gibt es Nachteile beim Anhängen einer Zeichenfolge im Vergleich zu einem jQuery-Objekt oder ist es eine schlechte Vorgehensweise? – brentonstrine

+0

Ich würde in diesem Fall eine Zeichenfolge verwenden. jQuery-Objekt eignet sich für den Fall, dass Sie ein komplexes dom-Element programmatisch (über viele Codezeilen hinweg) erstellen oder wenn Sie jQuery verwendet haben, um bereits ein dom-Element von der Seite zu erhalten. – nickdos

Antwort

7

Das Problem ist, dass Sie das gleiche Element mehrmals anhängen.
Verwenden Sie clone, um das Element zu klonen und dann append.

$('.contain').append($span.clone());

demo

aktualisieren:

So können Sie Ihr Element anpassen können und es dann mit allen Eigenschaften klonen.

var $span = $('<span/>', { 
        'class': 'someClass otherClass', 
        'css': { 
         'background-color': '#FF0000' 
        } 
      }); 
for (var i = 0; i < (myArr.length); i++) { 
    $('.contain').append($span.clone()); 
} 

demo2

Update2: nach this Kommentar.

$('.contain').append('<span class="yourClass"/>');

+1

oder noch einfacher '$ ('. Contain'). Append ('');' und keine $ span var – Fresheyeball

+0

@Fresheyeball Ich stimme in diesem Fall, aber auf diese Weise kann er die '$ span' anpassen und anhängen den gleichen Stil mehrmals. –

+0

@RicardoLohmann ist das nicht möglich, wenn eine Zeichenfolge angehängt wird? Konnte ich nicht '.append ('')'? – brentonstrine

Verwandte Themen