JQuery, $(this) / $(this) 와 this 차이

$(this)

 

$(this)는 클릭한 자기 자신을 의미한다.

id 속성은 가장 첫번째거 하나만 수정된다.

class 속성은 모든 class 속성이 수정된다. (동시에 모든클래스가 변경된다)

---

모든 .multiButton 바꾸기

 

$('.multiButton').html('감사합니다')

 

모든 .multiButton 중에서 클릭한 요소만 바꾸기

 

--> this 사용

 

클릭된 .multiButton 만 바꾸기

 

$(this).html('감사합니다')

$('.multiButton').click(function(){
	$(this).html('감사합니다')
});

---

this vs $(this)

 

제이쿼리 선택자는 제이쿼리 객체로 묶어버려서 object 형식으로 나타난다.
그래서 제이쿼리 선택자에서 DOM으로 다시 접근한 다음 지정해줘야 제대로 된 접근된다.

 

this는 자바스크립트 문법이고 $(this)는 제이쿼리 문법이다.

 

this의 경우 해당 이벤트가 발생한 요소를 표시해주고

$(this)는 이벤트가 발생하면 발생한 태그를 Object로 보여준다는게 다른점이다.

 

this와 같은 데이터를 갖기 위해서는 $(this)[0] 을 사용하면 된다.
this  === $(this)[0]

 

[결과] 
console.log(this); 결과

 

</input type="button" value="보이기" class="btn">

console.log($(this)); 결과

▼ S.fn.init [input]
   ▶ 0: input.btn
     length: 1
   ▶ [[Prototype]]: Object(0)