$표시는 제이쿼리를 뜻한다.
제이쿼리는 화면 마다 쓸 수 있다.
연결연산자(.)을기준으로 왼쪽은 클래스 오른쪽은 메서드이다.
제이쿼리는 연결연산자(.)왼쪽에 있기 때문에 클래스이다.
.click(function ( ) { } -> 클릭이벤트 리스너이다.
click이벤트리스너는 오른쪽에 있기 때문에 메서드이다.
id는 하나의 돔에 하나씩 있다.
돔(문서)은 <html>과</html>로 끝난다.
아무것도 없는 함수를 익명함수라고 하는데 이름을 적을 필요없기 때문이다.
#btn는 btn이란 id(#)를 타겟으로 잡았다는 것이다.
타겟을 잡고 이 타겟을 클릭하면 익명함수가 실행된다.
id가 btn인 타겟을 click하면 익명함수를 실행하는 로직이다.
jsp파일은 위에서 내려가면서 실행한다.
타겟이 스크립트 아래에 있기때문에 button이벤트가 제대로 실행되지 않는다.
타겟의 위치를 스크립트 위에 두면 실행이 된다.
타겟이 스크립트 아래에 위치해도 실행이 되게 하려면 도큐먼트 레디를 사용한다.
이벤트리스너가 도큐먼트 레디 안에 있어야 읽힌다.
jsp는 위에서 아래로 실행되는데 도큐먼트레디는 위에서 아래로 갔다가 다시 한번 돌아서 실행한다.
(도큐먼트 레디는 돔이 다그려지고 호출된다)
돔이 그려진 다음에 도큐먼트 레디가 호출되기 때문에 타겟이 아래에 있어도 이벤트리스너가 작동된다.
출처 : 한큐에 자바 수강내용
'웹 > Javascript' 카테고리의 다른 글
| 리터럴 방식의 배열 (0) | 2019.07.08 |
|---|---|
| 자바스크립트 구성요소 (0) | 2019.07.05 |
| apply( )함수 사용법과 Math.max.apply( )로 최대값 구하기 (0) | 2019.06.20 |
| 제이쿼리 선택자 셀렉터(selector) (0) | 2019.06.05 |
| 전역변수와 지역변수 (0) | 2019.06.04 |