JQuery DOM 생성/처리 문제

Question

그래서 JQuery에서 단 하나의 DOM div를 선택했다고 가정 해 보겠습니다. 나는 다음과 같이 새로운 DIV를 만들 진행 : 그 후

var DIV = $("<div>Hello, world</div>"); 

를, 그래서 같이 원래의 내부에 그 DIV를 배치하려고 :

이

$(OriginalDiv).append(DIV); 

좋아, 그 작동합니다. 이제 DIV를 더 편집하고 싶습니다.

.click, .html, .addClass에 대한 호출 (작동하지 않을 수 있음)이 작동하지 않습니다! 오케이, 대신에 :

var OriginalDiv = $("someSelector"); 
var DIV = $("<div>Hello, world</div>"); 
DIV = $(OriginalDiv).append(DIV); 

처음에는 효과가있는 것으로 보입니다. 그러나 대신 DIV가 OriginalDiv와 동일한 DOM 객체를 참조하고 새로 추가 된 DOM 객체는 참조하지 않도록 설정합니다. 당연히 이것이 DIV를 편집하는 것을 허용하지 않습니다.

var OriginalDiv = $("someSelector"); 
var DIV = $("<div>Hello, world</div>"); 
$(DIV).appendTo(OriginalDiv); 

및

var OriginalDiv = $("someSelector"); 
var DIV = $("<div>Hello, world</div>"); 
DIV = $(DIV).appendTo(OriginalDiv); 

조차 이러한 일 :

그래서, 다음, 나는 두 가지 이상의 방법을 시도해보십시오. 내가 설명하는 아주 좋은 일을하지 않은 경우

, 여기 내 정확한 딜레마

그때, JQuery와의 DOM 객체를 생성 jQuery를 사용하여 다른 DOM 객체에 추가하려고합니다. 문제는 일단 추가되면, .children과 같은 형식을 사용하지 않고 직접 액세스 할 수있는 방법이없는 것 같습니다.

내가 추가하고있는 DOM 객체에 대한 참조를 그 프로세스의 어딘가에서 직접 반환하고 싶습니다. 실제로 추가되는 것과 같습니다.

JQuery에서이 작업을 수행하는 방법을 잘 모르겠습니다. 솔루션을 아는 사람이 있습니까?

감사

--G

Answer 1

예, append은 새 요소가 추가 된 요소에 대한 참조를 반환하므로 작동하지 않습니다.

$("<div>Hello, world</div>") 
.click(function() { 
    // something 
    }) 
.appendTo('someSelector'); 

그러나 심지어

var $ele = $("<div>Hello, world</div>").appendTo('someSelector'); 

이 작동을이 쉽게 작동해야하므로 jQuery를이 방법 체인을 지원합니다. appendTo은 추가 된 요소에 대한 참조를 반환합니다. 이것이 당신을 위해 작동하지 않는 경우에, 당신은 다른 곳에 당신의 문제가있다.

---

코드에 대한 설명 : 이것은 문제가 아니지만 여기에서 무슨 일이 일어나고 있는지를 아는 것이 중요합니다. DIV 이미 jQuery를 객체이기 때문에

이 부분

var OriginalDiv = $("someSelector"); 
var DIV = $("<div>Hello, world</div>"); 
$(DIV).appendTo(OriginalDiv); 

는, 당신은, 당신이 jQuery를에 중첩 호출을 참조

$($("<div>Hello, world</div>")).appendTo($("someSelector")); 

과 동일합니다. 을 다시 jQuery에으로 보낼 필요가 없습니다.

appendTo에 직접 셀렉터를 전달할 수도 있습니다.

Answer 2

당신이 시도 할 수

;

var DIV = document.createElement('div'); 

;

$(div).html('Test!'); 

또는 무엇으로 사용하고 싶습니다.

Answer 3

DOM에서 아무것도 가져올 필요가 없습니다. jQuery로 요소를 작성하면 이미 DOM 요소에 대한 참조가있다. 문서에 그것을 삽입하는 것은 특별한 일을하지 않습니다.

// this will create the DOM element, and the jQuery 
// object wrapping that newly created DOM object 
// is assigned to DIV. 
var DIV = $("<div>Hello, world</div>"); 
// Don't worry about getting a return value from this 
// append() call. What we need is already available inside 
// the variable DIV. 
$(OriginalDiv).append(DIV); 

// continue using DIV as you normally would. It is referring 
// to the same DOM object that was just appended to the document. 
DIV.addClass('green');