jQuery의 .before()를 사용하여 새 요소를 추가하는 경우 추가 된 요소 클래스의 기존 .data() 값이 엉망입니다.

Question

새로운 div 요소를 이미 기존 세트에 추가하려고합니다. 공통 클래스로 표현되는 요소. 이 요소 집합에는 jQuery .data()가 있습니다.이 요소를 사용하여 부기 작업을 수행합니다.

"before()"를 사용하여 새 요소를 추가하려고 할 때 문제가 발생합니다. 앞에서 언급 한 .data() 값이 지워집니다. 그러나 "after()"를 사용하는 경우에는 그렇지 않습니다.

이 방법이 도움이되는지는 모르겠지만 들어오는 div 요소는 추가되는 기존 div 요소 집합과 동일한 클래스를 공유합니다.

I have created a self-contained example on jsfiddle.

차이점을 알기 위해 자바 스크립트 코드에서 .after() & .before() 사이의 줄을 전환하기 만하면됩니다.

여기에 쉽게 참조 할 수 있도록 코드도 붙여 넣습니다.

당신이 .data()과 선택에 어떤 데이터를 저장할 때 HTML 코드 조각

<div id="parent-container"> 

    <div id='child1' class="child">I am a child 1 - static</div> 

</div> 

자바 스크립트 코드 조각이

$(document).ready(function() { 

    var children = $(".child"); 

    children.data("newData", "Data for .child elements"); 

    alert("before dom manipulation -> " + children.data("newData"));   

    var dynamicChildDiv = $("<div id='child2' class='child'>I am child 2 - dynamic</div>");   

    // Adding a new div "after" the first .child works fine as far as preserving the existing properties on .class 
    $(".child:first").after(dynamicChildDiv); 

    // Adding a new div "before" the first .child causes havoc on the stored properties on .child 
    //UNCOMMENT ME AFTER COMMENTING THE ".after" method above. 
    //$(".child:first").before(dynamicChildDiv); 

    children = $(".child"); 

    alert("after dom manipulation -> " + children.data("newData")); 

}); 

Answer 1

는 그 선택의 모든 요소에 저장합니다. 하지만 검색하면 첫 번째 항목 만 선택됩니다.

첫 번째로 새로운 하나를 넣어, 당신은 당신이 가장 당신이 아무것도 반환 데이터에 액세스하려고 할 때 ..., 그것으로 당신의 요구 사항을 확실하지

을 같은 데이터를 저장하지만,하지 않기 때문에 같은 데이터를 모든 .child 요소에 저장할 필요는 없습니다. 첫 번째 요소의 이름을 딴 데이터 저장소 에 반환 값 : 어쩌면 단지

---

는 .data(key)

설명에서 인용 .. 공통 부모를 저장하고,뿐만 아니라 거기에서 검색 jQuery 컬렉션에서 데이터 (이름, 값)에 의해 설정됩니다.