[1] on() / off() - $ ( function () { ① $(selector).on( eventname , function (){} ); ② $(selector).on({ mouseenter : function (){}, mouseleave : function (){} }); }); - $ ( function () { $(selector).off() $(selector).off( eventName ) : 문서객체의 특정 이벤트와 관련된 모든 이벤트 제거 $(selector).off( eventName , function (){} ); : 특정 이벤트와 관련된 특정 이벤트 리스너 제거 }); # 이벤트 연결 방식 # ① bind 형식 : 현재 존재하는 태그에만 이벤트 연결 $(selector)..

[1] jQuery 기본개념 $( function () {}); → window.onload 같은 역활 $ ( function () { $ ( ' selector ' ).css( 'attribute' , 'value') ; $ ( ' * ' ).css( ' color ' , ' red ' ); }); selector : tag , id(#) , class(.) , attribute([]) , filter(:) [2] jQuery 배열 관리 - each 메서드 ( = for반복문 ) $.each ( object , function ( index , item ) { }); $( ' selector ' ).each ( function ( index , item ) { }); ex) h1태그가 여러 개 있을 경..

문서객체모델 ( DOM : Document Object Model ) - DOM에서 모든 객체들은 노드이다. - document node , element node , attribute node , text node , comment node [1] Document 객체 Attribute - document.body : body태그 - document.createElement ( " tagname ") : 태그 생성 - document.createTextNode ( " text " ) : 텍스트 생성 → window.onload = function () { var tag = document.createElement ( "h1" ); var text = document.createTextNode ( "He..

[1] 객체 - var student = { name : "Tom", korean : 95, math : 90, english : 95, Sum : function () { sum = this.korean + this.math + this.english ; return sum; } }; - name, korean, math, english : key - Tom, 95, 90, 95 : attribute (속성) - Sum : method (메서드) → alert ( student.Sum() ); - 객체도 반복문을 사용할 수 있다. for ( var key in student ) { alert ( key + ' : ' + student[key] ) ; } - 객체에 속성과 메서드를 추가할 수 있다. st..

[1] 기본 용어 정리 - 표현식 : 값을 만들어내는 간단한 코드 ( 10 , 10+20 , korean )- 문장 : 하나의 표현식이 모여 만들어짐 ( 10+20+30; )- 식별자 : 이름을 붙일 때 사용 규칙 : 키워드사용x , 숫자로시작x, _ or $ 만 사용가능, 공백사용x 단독으로 사용 다른 식별자와 사용 식별자 뒤에 괄호가 있음 함수 메서드 식별자 뒤에 괄호가 없음 변수 속성- 주석 : /* ... */ or // [2] 출력 - 배열요소 = array [ Index ] apple = array [ 0 ] pineapple = array [ 1 ] orange = array [ 2 ]- array.length = 3 - 문자열도 배열처럼 length 속성이 있다. - string.lengt..

[1] 기본 개념 - h1 : 선택자- color : Style 속성- red : Style 속성값- { } : css block [2] 선택자 [2]-1 전체 선택자( * ) : html, body 에 있는 모든 태그를 선택[2]-2 아이디 선택자( #id ) [2]-3 태그 선택자 ( tagname )[2]-4 클래스 선택자 ( .classname )[2]-5 속성 선택자- 선택자[속성]- 선택자[속성=A] : 속성 = A- 선택자[속성^=A] : 속성의 시작값이 A - 선택자[속성$=A] : 속성의 끝값이 A[2]-6 후손 선택자 ( A B ) [2]-7 자손 선택자 ( A > B ) A의 직계자손 B[2]-8 동위 선택자 - 선택자A + 선택자B { } : A태그 바로 뒤의 B태그 - 선택자A ~..