"this"가 jQuery에서 작동하는 방식

Question

jQuery에서 "this"가 어떻게 작동하는지 설명 할 수 있습니까? 나는 그물에 대한 정보를 찾으려고 노력했는데, "이"가 평소의 의미에서 많이 사용 되었기 때문에 나는 아무것도 찾을 수 없었다.

각 목록 요소에 ID를 부여하지 않고도 목록 요소 (<li>) onclick의 배경을 변경하고 싶습니다.

Answer 1

$("li").click(function() { 
    $(this).css("background-color", "red"); 

}); 

다음은 예입니다. $(this)은 JQuery 객체를 참조하고 this은 클릭 한 일반 DOM 객체를 나타냅니다.

Answer 2

click() documentation을 찾았습니까? 그것은 클릭 핸들러 과을 사용해야하는 방법을 보여줍니다. $(this)을 사용하는 예제도 있습니다.

$('li').click(function() { 
    $(this).attr("class", "clicked"); 
}); 

하나의 아이템을 클릭, this 그는 DOM 요소이며, 클릭되는 항목의 값을 취

Answer 3

$('li').on('click.namespace', function() { 

    console.log(this); /* this is a reference to the DOM 
          element you clicked */ 

    console.log($(this)); /* this is a jQuery reference to the 
          DOM element you clicked */ 

    /* using jQuery reference you can change the background in this way */ 
    $(this).css('background-image', 'url(...)'); 




}); 

Answer 4

여기 일례이다. $(this)을 사용하면 jquery API에 액세스 할 수 있습니다.

Answer 5

li에 onclick 이벤트를 설정하면 $ (this)를 사용하여 li의 jquery 객체를 가져온 다음 클래스를 추가 할 수 있습니다. $ (this) .addClass ("newBackground").

Answer 6

jQuery는 함수의 컨텍스트를 흥미로운 것으로 설정할만큼 충분히 친절합니다.이 경우에는 <li>입니다. 하지만 this은 여전히 ​​Naked DOM 요소이므로 jQuery 메서드를 사용하려면 $()으로 포장해야합니다.

$('li').on('click', function() { 
    $(this).css({background:'red'}); 
}); 

Answer 7

때때로 대신 this의, 당신의 event.currentTarget 속성을 사용하여 볼 수 있습니다, 당신은 다르게 현재 요소에 액세스 할 수 있습니다 이러한 경우, 이벤트 핸들러로 (jQuery.proxy() 참조) 바인딩 기능을 사용할 필요가 http://api.jquery.com/event.currentTarget/