코딩룸*◡*

.on('click') 과 .click()의 차이점 본문

공부좀 하자/jQuery

.on('click') 과 .click()의 차이점

코딩하는 묭이💛 2017. 7. 10. 10:50

차이점

1. 사용패턴이 다름 ( on은 그페이지가 시작될때 실행되고, click은 페이지가 시작되고 나서 실행됨?)


2. click을 쓰면 많은 요소들은 많은 개별 핸들러를 필요로 해서 메모리 사용량이 증가됨


3. click은 기존의 핸들러들에 동적으로 추가된 요소들이 안먹힘

ex)

<html>

<button id="add">Add new</button>

<div id="container">

<button class="alert">alert!</button>

</div>

</html>


<script>

$("button#add").click(function() {

var html = "<button class='alert'>Alert!</button>";

$("button.alert:last").parent().append(html); });

</script>


4. on은 하나의 핸들러가 동적으로 새롭게 만들어지는 요소들을 포함해서 대응되는 모든 요소들을 다루고 있다.

ex)

$("div#container").on('click', 'button.alert', function() { alert(1); });



5. on이 click보다 메모리를 덜 먹고 동적으로 생성되는 요소들이 잘 작동함


6. on은 .off('click' )으로 보통 없앨 수 있다.



결론: .on('click')이 .click()보다 좋다!

반응형

'공부좀 하자 > jQuery' 카테고리의 다른 글

[jquery]offset  (0) 2017.11.27
마우스휠 바  (0) 2017.09.18
마우스 휠 한번에 한 영역씩 이동하기  (0) 2017.09.14
[jQuery]화면 크기에 따라 이미지 변경  (0) 2017.08.23
슬라이드 배너  (0) 2017.07.26
'공부좀 하자/jQuery' Related Articles more
Comments