2016-07-02 9 views
1

Ich habe eine Situation, in der ich ein Geschwisterelement zu einem jQuery-Objekt hinzufügen muss, das in einer Variablen gespeichert ist. Ich brauche das hinzugefügte Element, um das vorherige Geschwister dieses jQuery-Objekts zu sein.Wie fügen Sie mit jQuery ein Element vor einem anderen Element hinzu, ohne Kopien zu erstellen?

Die vereinfachte Version würde in etwa so aussehen https://jsfiddle.net/sjncgaLf/4/

$(document).ready(function() { 

    var test = $('<div class = "test">test</div>'); 
    var el = $('<div class = "el">el</div>'); 

    //I want to add el before test (without making a copy) 
    //and then append the selector (el + test) to the DOM 

    el.before(test); 
    $("body").append(test); 
}); 

klar, basierend auf dem jsfiddle, wird dieser Code nicht erreichen die Auswirkungen auf Wunsch. Mein Ziel ist es, ein Ergebnis wie folgt zu erreichen

<div class = "el">el</div> 
<div class = "test">test</div> 

Ohne die ursprünglichen Elemente zu kopieren. Ich habe die .before, .insertBefore und .add Dokumentation gründlich gelesen, und es sieht so aus, als würde keiner von denen genau das produzieren, was ich hier möchte.

Vielen Dank im Voraus.

EDIT:

Ich muss annehmen, um mehr klar sein. Ich mache einen Kalender 1 Monat nach dem anderen. Ich muss mit einer Variablen wie $ Markup beginnen und Wochen hinzufügen, bis ich jeden Tag im Monat hinzugefügt habe. Ich muss dem Monat auch ein Label hinzufügen, wie "Juli 2016". Also, bevor ich irgendwelche Wochen meiner $ Markup Variable anhängen, oder irgendetwas anhängen auf das DOM, möchte ich meine $ Markup wie dieses Ich werde

<div class = "label">July 2016</div> 
<div class = "CalendarWeek"></div> 

schauen dann iterieren über die Tage des Monats und fügen Sie als viele CalendarWeek und CalendarDay als notwendig.

+0

Vielleicht brauchen wir mehr von Ihrem tatsächlichen Code, weil das Anhängen von el dann Anhängen Test wie folgt funktioniert gut: https://jsfiddle.net/sjncgaLf/8/ –

+0

* "... Ergebnis wie folgt: EL, TEST" * obwohl du 'el.before (test)' ... ?? –

+0

Was hält Sie von der offensichtlichen Lösung '$ (" Körper ") ab. Append (el); $ ("Körper"). append (test); '? –

Antwort

1

Sie können das mit derMethode tun. Ich habe Ihre aktualisiert jsFiddle

$(document).ready(function() { 
    // create elements 
    var test = $('<div class = "test">test</div>'); 
    var el = $('<div class = "el">el</div>'); 
    // add the first element 
    $("body").append(test); 
    // insert the second element 
    el.insertBefore(test); 
}); 
0

auf Ihrem Update Basierend, Sie müssen nur Ihre Variable bearbeiten, sich keine Sorgen über Daten, um anhängt.

Also für Ihre $ Markup Variable, wenn es bereits Daten hat und Sie möchten Ihre Monat Etikett am Anfang hinzufügen möchten, benutzen Sie einfach:

$temp = $label + $markup; 
$markup = $temp; 

bis zum Ende Ihrer $ Wochen oder Tage Daten hinzufügen Markup-Variable, verwenden Sie einfach:

$markup = $markup + $day; 

Sobald Sie die gesamte Variable, die die Art und Weise gebaut haben Sie Sie jQuery verwenden können sie anhängen, wo Sie wollen.

+0

Ich glaube nicht, dass Sie mit dem Operator '+' zwei jQuery-Objekte hinzufügen können. – Robert

+0

Es funktioniert gut.Das ist eine Möglichkeit, Strings in Javascript zu verketten. –

+0

auf Strings, nicht Objekte. – Robert

Verwandte Themen