Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 별자리 시전
- 연애후
- css 퍼블 사용
- react class
- 배울때 태도
- css 사용팁
- 퍼블리셔 업무
- react className
- a 새창 띄우기
- ios 크로스브라우징
- 퍼블리셔 면접
- 팝업 가운데로
- 자바스크립트 독학
- 하이브리드앱 크로스브라우징
- 퍼블 면접
- 나는 언제쯤 인연을 만날수 있을까
- 여자쳐다보는 남친
- 연애 후 느낀점
- 퍼블리셔 협업툴
- 관심가는 차
- js a 새창 띄우기
- 퍼블 업무툴
- ios 크로스
- 프론트엔드 개발 독학
- 레이어 가운데로
- 경력 퍼블리셔
- svg 사용
- react sass
- js 독학
- 화면 가운데로 띄우기
Archives
- Today
- Total
코딩룸*◡*
.on('click') 과 .click()의 차이점 본문
차이점
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 |
Comments