1) addClass() 메소드
객체의 클래스 속성 추가
형태: $('선택자').addClass('클래스명');
2) removeClass() 메소드
객체의 클래스 속성 제거
형태: $('선택자').removeClass('클래스명');
3) attr() 메소드
속성과 관련된 모든 기능 수행
형태
$('선택자').attr('키값') -> 속성 반환
$('선택자').attr('키값', '속성값') -> 키값의 속성값 변경
$('선택자').attr({키값1:속성값1; 키값2:속성값2;...}) -> 여러 키값의 속성값 변경
4) removeAttr(name) 메소드
객체의 속성 제거
형태: $('선택자').removeAttr('키값') -> 키값의 속성값 제거
5) css() 메소드
$('선택자').css('키값') -> style 키값의 속성값 반환
$('선택자').css('키값', '속성값') -> style 키값의 속성값 변경
$('선택자').css({키값1:속성값1; 키값2:속성값2;...}) -> 여러 style 키값의 속성값 변경
6) html(), text() 메소드
객체 내부의 글자와 관련된 모든 기능 수행
두 메소드의 차이는 text() 메소드의 경우 html 태그를 인식하지 않음
형태
$('선택자').html() -> 첫 번째 선택자가 가진 텍스트 반환
$('선택자').text() -> 모든 선택자가 가진 텍스트 반환
$('선택자').html('값') -> 모든 선택자에 텍스트 추가
$('선택자').text('값') -> 모든 선택자에 텍스트 추가(html태그 그대로 표시)
*매개변수에 function(index, '값') {return 리턴값;}을 입력해서 다양하게 추가도 가능
7) detach(), empty(), remove() 메소드
empty() : 하위 요소를 비움
detach() : 지정한 요소를 포함해서 하위 요소 전부 제거
remove() : 지정한 요소를 포함해서 하위요소 모두 제거(이벤트 및 데이터 포함)
8) jQuery() 메소드로 객체 생성
jQuery() 메소드는 객체 선택 기능 외에도 문서객체를 선택하는 기능이 존재
예시
$('
').html('Hello World') ->$('img />').attr('src', 'cat.jpg).appendTo('body'); -> body태그에 1.jpg 이미지 추가
9) 객체 삽입 메소드
객체를 추가하는 메소드는 총 8개가 존재한다.
객체 삽입 메소드를 통해 객체 이동이 가능
생성 후 삽입: A에 '<'로 시작해서 '>'로 끝나는 객체 생성 후 삽입(
태그 불가)
객체 이동: A객체를 B에 삽입
$(A).appendTo(B) : A를 B 태그 내 뒷부분에 추가
$(A).prependTo(B) : A를 B 태그 내 앞부분에 추가
$(A).insertAfter(B) : A를 B 태그의 뒤에 추가
$(A).insertBefore(B) : A를 B 태그의 뒤에 추가
$(A).append(B)
$(A).prepend(B)
$(A).after(B)
$(A).before(B)
10) clone() 메소드
객체 복사 메소드
객체를 복사해서 삽입할 때 사용
형태
$('선택자').clone()
$('선택자').clone(withDataAndEvents)
$('선택자').clone(withDataAndEvents, deepWithDataAndEvents)
Boolean withDataAndEvents: 이벤트 핸들러와 데이터 요소 복사여부(기본값 false)
Boolean deepWithDataAndEvents:이벤트 핸들러와 모든 자식요소 복사 여부