본문 바로가기

jquery7

[jquery] detach 와 remove detach -선택한 요소를 DOM 요소에서 삭제(데이터와 이벤트는 유지) remove -선택한 요소를 요소에서 제거(데이터와 이벤트는 삭제) 아래 예제을 보면 detach을 사용한 버튼 이벤트의 p 태그 클릭 이벤트는 버튼을 클릭해도 이벤트가 유지하고 있지만 remove을 사용한 버튼 이벤트의 p 태그는 버튼을 클릭하면 p 태그의 클릭 이벤트도 같이 사라진다. See the Pen detach() and remove() by onion (@saetmlda) on CodePen. 참고 사이트 : api.jquery.com/remove/ .remove() | jQuery API Documentation Description: Remove the set of matched elements from the D.. 2021. 1. 10.
[jquery] after 와 insertAfter / before 와 insertBefore after -선택한 각 요소 뒤에 지정한 코드를 삽입 -선택한 각 요소 뒤에 삽입 할 요소를 반환하는 함수 전달이 가능하다 insertAfter - 선택한 각 요소를 대상 요소 뒤에 삽입 -함수 전달 불가능 See the Pen after & insertAfter by onion (@saetmlda) on CodePen. before - 선택한 각 요소 앞에 지정한 코드를 삽입 -선택한 각 요소 뒤에 삽입 할 요소를 반환하는 함수 전달이 가능하다 insertBefore - 선택한 각 요소를 대상 요소 앞에 삽입 See the Pen dypqoKX by onion (@saetmlda) on CodePen. 참고 : .after() ,.before()및 .insertAfter(),insertBefore() .. 2021. 1. 10.
[jquery] append/appendTo 와 prepend/prependTo append -선택한 각 요소의 마지막에 지정한 코드를 삽입 -선택한 요소를 대상 요소의 마지막에 삽입 See the Pen append & appendTo by onion (@saetmlda) on CodePen. prepend -선택한 각 요소의 처음에 지정한 코드를 삽입 prependTo -선택한 요소를 대상 요소의 맨 처음에 삽입 See the Pen prepend & prependTo by onion (@saetmlda) on CodePen. 2021. 1. 10.
[jquery] wrap() 와 wrapAll() wrap -선택한 각 요소의HTML 구조를 포함 wrapAll -선택한 요소의 HTML 구조를 포함 See the Pen wrap & warpAll by onion (@saetmlda) on CodePen. 2021. 1. 10.
[jquery]clone 요소 복사 clone() -선택한 요소의 복사 참고 : 성능상의 이유로 특정 양식 요소의 동적 상태 (예 :에 입력 된 사용자 데이터 textarea및에 대한 사용자 선택 select)는 복제 된 요소에 복사되지 않습니다. input요소를 복제 할 때 요소의 동적 상태 (예 : 텍스트 입력에 입력 된 사용자 데이터 및 확인란에 대한 사용자 선택)가 복제 된 요소에 유지됩니다. See the Pen clone by onion (@saetmlda) on CodePen. 참고사이트 : api.jquery.com/clone/#clone-withDataAndEvents .clone() | jQuery API Documentation Description: Create a deep copy of the set of match.. 2021. 1. 10.
[jquery] 요소 찾기 addBack() - 선택한 요소의 하나 이전에 선택했던 요소를 추가 See the Pen OJRwKdR by onion (@saetmlda) on CodePen. closest() -선택한 자신부터 부모 요소 중 각 요소가 지정한 선택자와 일치하는 요소 var r1 = el.closest("#div-02"); // id=div-02 조건이 만족하므로 속성을 가진 부모 요소가 반환된다. var r2 = el.closest("div div"); // div 요소에 만족한 요소 중 div 자식을 가리키므로, id=div-03 자신이 만족된다. var r3 = el.closest("article > div"); // 가장 가까운 article 요소 바로 하위의 div 요소 id=div-01 속성을 가진 요소가.. 2021. 1. 10.