머리말
jquery는 프로젝트에서 dom 요소를 추가하고 삭제하는 데 자주 사용되므로 dom 요소의 바인딩 이벤트 방식을 사용하므로, 바인딩, 라이브, 위임, 켜기의 차이점을 간략하게 요약해 보겠습니다. 나중에 참고할 수 있도록 하고, 앞으로 이 글이 친구들에게 도움이 되기를 바랍니다. 혹시 잘못된 점이 있으면 지적하고 소통했으면 좋겠습니다.
One.bind()
간략한 설명
bind()는 일치하는 요소에 하나 이상의 이벤트 핸들러를 추가합니다.
사용법
$(selector).bind(event,data,function)
event: 요소에 추가된 하나 이상의 이벤트(예: click , dblclick) , etc.;
단일 이벤트 처리: 예: $(selector).bind("click",data,function);
다중 이벤트 처리: 1. 공백을 사용하여 여러 이벤트를 구분합니다. , 예: $(selector).bind("click dbclick mouseout",data,function);
2. 중괄호를 사용하여 $(selector).bind({event1:function)와 같이 여러 이벤트를 유연하게 정의합니다. , event2:function , ...})
3. 공간 분리 방법: 바인딩은 상대적으로 엄격하며, 동일한 함수를 호출하는 여러 이벤트를 처리하는 데 적합합니다. >
중괄호 대체 방법: 바인딩이 더 유연하며, 함수를 이벤트에 별도로 바인딩할 수 있습니다. 데이터: 선택 사항; 함수: 필수; 바인딩 이벤트가 발생하면 함수를 실행해야 합니다. 은 Jquery 버전에 적용됩니다. 은 모든 버전에 적용되지만 공식 홈페이지에 따르면 jquery 1.7 버전부터 바인딩() 함수는 on()으로 대체하는 것이 좋습니다. 2. Live()간단한 설명
delegate()는 지정된 요소(선택한 요소의 하위 요소) 프로그램에 하나 이상의 이벤트 핸들러를 추가합니다. 이러한 이벤트가 발생할 때 실행할 기능을 지정합니다. Delegate() 메서드를 사용하는 이벤트 핸들러는 현재 또는 미래의 요소(예: 스크립트로 생성된 새 요소)에 적용됩니다.
childSelector: 선택 사항; 이벤트 핸들러를 추가해야 하는 요소(일반적으로 선택기의 하위 요소)
data: 선택 사항;
함수: 필수; 바인딩 이벤트 발생 시 실행해야 하는 함수
Jquery 버전에 적용
jquery1.7 버전 이후에는 바인딩을 대체하는 데 사용됩니다. (), live() 바인딩 이벤트 메서드
5. 네 가지 메서드의 유사점, 차이점, 장단점
동일점:
1. 단일 요소 및 다중 이벤트, 공백 방식 또는 중괄호 교체 방식으로 구분
2. 둘 다 이벤트 버블링을 통해 이벤트를 문서에 전달합니다.
🎜>
1. 바인딩() 함수는 기존 요소에 대해서만 이벤트를 설정할 수 있지만 live(), on() 및 Delegate()는 모두 향후에 새로 추가되는 요소에 대한 이벤트 설정을 지원합니다. >2.bind () 함수는 jquery 버전 1.7 이전에는 상대적으로 인기가 있었지만, 버전 1.7이 나온 이후에는 공식적으로 바인드()가 권장되지 않았는데, 이 역시 버전 1.7에서 새로 추가된 함수입니다. , 버전 1.9에서 삭제된 live() 함수를 대체하는 데 사용됩니다3. live() 함수는 Delegate() 함수와 유사합니다. live() 함수는 Delegate()에 비해 실행 속도가 빠릅니다.4.bind()는 유연성 측면에서 모든 버전의 Jquery를 지원하고 CSS 선택기 지원은 jquery1.8-을 지원합니다. () jquery1.4.2+ 지원; on() jquery1.7+ 지원 7. 요약프로젝트에서 참조하는 jquery 버전이 낮은 버전인 경우 사용을 권장합니다. 상위 버전의 jquery에서는 on()을 대신 사용할 수 있습니다. 위 내용은 제 개인적인 의견일 뿐이므로 자유롭게 공유해 주세요.