[자바스크립트&제이쿼리]

 

기본적인 것들

//한줄 주석
/*여러줄 주석*/      ]

  

화면에 텍스트 표시하기

01. 자바스크립트

-  선택자.명령어(실행문)

-  ex : 화면.표시하여라(tset)

   document.write('test')

- 자바스크립트는 어디에 쓰느냐에 따라 실행(출력)위치가 달라진다. 

02. 제이쿼리

- 제이쿼리는 문서가 준비되면 실행 (body안에 있는 모든 내용을 불러오고 나서)

- $(선택자).명령어(실행문)

- '문서가 실행되면 시작하여라' 선언 후 실행

        $(document).ready(function(){

            document.write('test')

        })

 - ex : $(document).ready(function(){

            //.box의 배경색을 gold로 변경하여라
            // 스타일을 변경하는 제이쿼리는 무조건 .css('변경할 속성','변경 값')
            // 내가 클래스or아이디를 만들었기때문에 '' 또는 "" 안에 클래스명 넣어야함
            // ★ +제이쿼리는 선언하면 inline style로 적용된다.

            $('.box').css('background-color','gold')

        })

JQuery Filter

$(선택자).명령어(실행문)

- 첫번째 a의 배경색을 pink로
- 제이쿼리는 .list가 몇 그룹이 있던 하나로 생각한다.
- :first-child, :last-child 다 쓸필요 없이 first, last만 사용해도 됨
- eq(3) 제이쿼리는 0부터 시작 / 보여지는 3번째 태그에 선언을 하고 싶으면 eq(2)라고 해야됨

        $('.list li:first a').css('background-color','#ff1499') //첫번째 a

        $('.list li a:last').css('background-color','pink') //마지막 a

        $('.list li a:eq(2)').css('background-color','gold') //3번째 a 

* 하위 브라우저에서 인식 못함 (익스8 이하, 익스10)

    :first-child {} 처음 태그

    :last-child {} 마지막 태그

    :nth-child(숫자) {} 지정 태그

    :nth-child(2n) {} "짝수"

    :nth-child(2n+1) {}  "홀수"

    :nth-child(even) {} "짝수"

    :nth-child(add) {} "홀수"