JQuery와 :이 질문에 대한 유사 메모리

Question

에 Prebuilding : JQuery: Build HTML in 'memory' rather than DOM

내가 가지고

var $container = $("#container"); 

또한이 :

jQuery.fn.somedomedits = function(expr) { 
    return this.each(function() { 
     var $self = $(this); 
     $self.find(".adsf").append("<div></div>"); 
     // A lot more complex dom insertions like this 
    }); 
}; 

을 지금 내가 뭘 :

$container.somedomedits().somemoredomedits(); 
// The somemoredomedits method is a similar plugin to the first one. 

이렇게하면 DOM이 직접 변경됩니다.

은 그럼 내가 그랬어 :

var $editeddom = $container.somedomedits().somemoredomedits(); 
$containerwrapper.html($editeddom); 

올바른 방법은이 작업을 수행인가요?

Firebug/여우의 속도가 향상되지 않았지만 다른 브라우저에 도움이되는지 확신 할 수 없습니다. 그것은

$container.somedomedits().somemoredomedits(); 

로 같은 일을 더한 변수에 할당 한 추가 방법 (html())를 실행 있기 때문에

감사

Answer 1

이 코드는

var $editeddom = $container.somedomedits().somemoredomedits(); 
$containerwrapper.html($editeddom); 

느립니다.

전체 구조가 준비된 후 즉석에서 요소를 만들고 DOM 트리에 삽입하는 것이 더 빠르지 만, jQuery 선택기로 DOM에서 요소를 가져 오는 경우에는 여전히 DOM은 "지적한다". 변수를 변수에 할당한다고해서 자동으로 복제되지는 않습니다.

이 개체를 복제 한 다음 복제본을 수정하여 작업을 완료 한 후에는 콘텐츠를 대체 할 수 있지만 먼저 복제 작업이 빠르면 DOM에서 직접 작업 한 내용이 손실되는지 먼저 확인해야합니다.

// clone part of DOM 
// .clone(true) clones event handlers as well if you don't need it 
// you can just run .clone() 
var items = $(selector).clone(true); 

// perform your complex operations 
items.somedomedits().somemoredomedits(); 

// replace part of DOM with modified clones 
$(selector).replaceWith(items);