JavaScript jQuery najlepszy sposób na wstawienie dużego kawałka kodu do DOM

Question

Mam duży kawałek kodu, który musi zostać wstawiony do DOM w pewnym momencie. Kod zawiera również pewne zmienne:

<ul id="info'+value+'" class="info"><li class="hide"></li><li class="lock"><ul> 
// just a piece of the code with variable "value" 

Teraz robie:

var codeToInsert = "<some code/>" 
codeToInsert.insertAfter('#someID'); 

Czy istnieje lepszy sposób to zrobić z punktu widzenia wydajności?

Answer 1

Jeśli chcesz wstawić duży kawałek kodu, użyj jQuery dla swojego selektora, a następnie użyj właściwości DOM innerHTML - jest to najszybszy sposób na wstawienie dużego fragmentu kodu HTML. Nie owijaj łańcucha, który ma zostać wstawiony do JQuery, pozostaw jako ciąg.

Np .: $('#somePlaceholder')[0].innerHTML = myHTMLString;.

http://www.quirksmode.org/dom/w3c_html.html:

W ogólnym innerHTML jest szybszy niż normalnych metod DOM ponieważ parser HTML jest zawsze szybciej niż silnik DOM. Jeśli chcesz wprowadzić skomplikowane zmiany, użyj innerHTML. (W przypadku prostych zmian to nie ma znaczenia, której metody użyć, chociaż innerHTML pozostaje teoretycznie szybciej.)

Jeśli zrobisz ciąg konkatenacji w JS, utworzyć tablicę, push() części i join() na końcu zamiast dołączania z np += lub +. To czyni różnicę esp. w IE.

Answer 2

mojej głowie, można również użyć .append(),(), .appendT .Przed() .Po() itd Sprawdź to dla wielu takich funkcji: http://api.jquery.com/category/manipulation/