> 웹 프론트엔드 > JS 튜토리얼 > jQuery: click() 메서드에서 이를 사용하여 문제 해결

jQuery: click() 메서드에서 이를 사용하여 문제 해결

黄舟
풀어 주다: 2017-06-27 10:00:05
원래의
4868명이 탐색했습니다.

jQ 버전: jquery-1.7.2.js

    <div id="box">test</div>
로그인 후 복사
<script>
    $(function(){ 
        $(&#39;#box&#39;).click(function(){ 
            //alert(this.html()); // 报错
            alert(this.innerHTML);// test
            alert($(this).html()); // test
        });    
    });</script>
로그인 후 복사

실례합니다. $('#box')를 통해 얻은 후 jQueryobject를 얻었는데, 이것이 왜 DOM 객체에 해당합니까? , 그리고 $(this)는 jQuery 객체인가요? 감사해요!

jquery 없이는 js가 없고, js 없이는 jquery가 없다는 것을 알아야 합니다. 이것은 js의 내용입니다. function 실행 환경에서 이것은 기본 js에 속합니다. 어떻게 jquery 객체를 가리킬 수 있습니까? $(this) 조끼를 입는 것은 jquery 객체입니다.

thisreferences는 함수 실행의 환경 개체입니다. 예를 들어 전역적으로 호출되면 window입니다. 따라서 this는 $("#box")에 의해 반환되지 않으며 JQ 개체가 아니라 이 함수를 호출하는 div의 dom 개체입니다. 이 점을 주의 깊게 이해하시기 바랍니다. 휴대폰으로 타이핑하는 것은 매우 어렵습니다. 그래도 이해가 되지 않는 부분이 있으면 내일 컴퓨터를 켜면

$('#box')가 JQuery 객체를 반환했다는 메시지가 표시되므로 click( ) 나중에 이 단계는

var $box = $(&#39;#box&#39;);
$box.click(function(){    //TODO});
로그인 후 복사

와 동일합니다. 함수 실행의 환경 객체는 코드에서 얻은 객체와 아무 관련이 없습니다. 핵심은 이벤트 를 이 DOM에 바인딩하는 것입니다. 이벤트가 트리거되면 이것은 단지 DOM입니다.

$(this)는 이것을 변경하지 않습니다. DOM 객체는 쉘 레이어를 추가하는 것처럼 JQuery 객체로 변환하여 JQuery 메서드를 사용할 수 있도록 한 번만 래핑됩니다. 선택기를 전달하는 것처럼 DOM을 찾지 않으므로 여전히 이 이벤트 div.box에 대한 현재 트리거입니다. 래핑된 JQuery는 DOM 객체로 복원될 수 있습니다.

이벤트 개체를 통해 이벤트를 트리거한 개체를 가져오려면 다음 코드를 살펴보세요.

$(&#39;.box&#39;).click(function(event){    console.log(event.target);    console.log(event.target==this);//非事件冒泡情况下为true
    console.log($(this).get(0)==this);//true});
로그인 후 복사

위 내용은 jQuery: click() 메서드에서 이를 사용하여 문제 해결의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿