공지사항 jquery&javascript (3) 정리

0) javascript 기초 코드

변수와 함수

 - var 변수명; // 변수 선언

 - 변수명 = 0; //변수에 데이터 대입 혹은 초기화

 - function(){} //함수 실행

 

조건문 

 - if (조건문) { 실행문 } // 참일 때 실행

 - else if (조건문) { 실행문 } // 거짓일 때 조건에 맞으면 실행

 - else { 실행문 } //거짓일 때 실행

 - switch { case 1 : 실행문 1 break; } //결과값이 케이스와 일치했을 때 실행문,

                                                  조건문을 빠져나올 수 있도록 break 선언.

 

 반복문

 -  while (조건문) {} //조건문이 참일때만 반복

 -  for( i=0; i<변수; i++ ); // 조건문이 지정( 초기식; 표현식; 증감식)

 - setInterval( funtion(){ }, 시간 );  // 반복할 함수 , 시간

 

1) jquery 사용 기초 코드

 - $(document).ready(function(){}); // 문서 대기 함수 실행

 - $(function(){}); // 함수 실행

  * html 요소가 렌더링 되지 않은 상태에서 javascript를 불러왔을 때, javascript는 충돌로 인해 기능이 정지되므로,

    이를 방지하기 위해서 javascript를 문서 렌더링 후 불러오도록 지정해야 한다. 

  **이를 위해 ready() 혹은 script 실행 시 defer 를 사용하여 불러온다. 

 

2) event문 기초 코드 

 - mouseenter(); // 마우스가 들어갈 때 

 - mouseover(); // 마우스가 올라와 있을 때 

 - mouseleave(); // 마우스가 떠날 때

 - click(); // 클릭할 때

 

3)검색 및 선택 메소드

 - find('검색어') // 검색할 대상의 선택자명을 입력하여 선택한다.

 - eq() // 형제 선택

 - child() // 자식 선택

 - parent() // 부모 선택

 

4)데이터 추출 메소드

 - text(); // 자식 속성에 해당하는 컨텐츠 영역에 text 만을 추출

 - html(); // 자식 속성에 해당하는 영역에 html 태그를 포함하여 추출.

 - css('속성명') // css의 추출

 - index(); //순서 추출 eq()에 대입하여 사용 가능.

 

5)효과 기술

 - show(); & hide();

 - slideDown(); slideUp();

 - fadeIn(); fadeOut();

 - animate({}, 시간 )

 

 - stop(); // 일시정지

 - delay( 시간 ); //시간만큼 지연시킨다.

 - finish(); // 효과를 중지하고 건너뛴다.

6) 연산자

(1) + - * / % // 사칙연산 연산자들 더하기 빼기 곱하기 나누기 나머지 

(2) ++ -- // 증감 연산자 : 현재 상황을 기준으로 연산 전후 1을 더하거나 빼는 연산자

(3) = += -= *= /= %= // 대입 연산자 : 새로운 값을 대입하는 연산자

(4) == === != !== > >= < <=  // 비교 연산자 결과값으로 true & false 를 반환하는 연산자

(5) && || ! // 논리 연산자 true와 false를 연산하는 연산자