English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
jQuery의 매우 중요한 부분은 DOM 요소를 조작할 수 있다는 점입니다。
jQuery는 HTML 요소, 속성 및 CSS를 효율적으로操作하는 방법을 제공합니다。
이 메서드는 요소에 할당된 클래스 속성을 확인하고操作합니다：
| 메서드 | 설명 |
|---|---|
| addClass() | 한나 여러 개의 클래스 이름을 선택된 요소에 추가합니다 |
| hasClass() | 선택된 요소가 지정된 클래스 이름을 가지고 있는지 확인합니다 |
| removeClass() | 선택된 요소에서 하나나 여러 개의 클래스를 제거합니다 |
| toggleClass() | 추가될 때/선택된 요소에서 하나나 여러 개의 클래스 간 토글을 제거합니다 |
이 메서드는 요소를 복제할 수 있게 합니다:
| 메서드 | 설명 |
|---|---|
| clone() | 선택된 요소의 깊은 복제본을 생성합니다 |
이 메서드들은 기존 내용 주위에 새로운 내용을 삽입할 수 있게 합니다:
| 메서드 | 설명 |
|---|---|
| wrap() | 각 선택된 요소를 둘러싸는 HTML 요소를 삽입합니다 |
| wrapAll() | 모든 선택된 요소를 둘러싸는 HTML 요소를 삽입합니다 |
| wrapInner() | HTML 요소로 각 선택된 요소의 내용을 둘러싸습니다 |
이 메서드들은 기존 요소 내에 새로운 내용을 삽입할 수 있게 합니다:
| 메서드 | 설명 |
|---|---|
| append() | 선택된 요소의 끝 부분에 내용을 삽입합니다 |
| appendTo() | 선택된 요소의 끝 부분에 HTML 요소를 삽입합니다 |
| html() | 선택된 요소의 HTML 내용을 설정하거나 반환합니다 |
| prepend() | 선택된 요소의 시작 부분에 내용을 삽입합니다 |
| prependTo() | 선택된 요소의 시작 부분에 HTML 요소를 삽입합니다 |
| text() | 선택된 요소의 텍스트 내용을 설정하거나 반환합니다 |
이 메서드들은 기존 요소 외에 새로운 내용을 삽입할 수 있게 합니다:
| 메서드 | 설명 |
|---|---|
| after() | 선택된 요소 뒤에 내용을 삽입합니다 |
| before() | 선택된 요소 앞에 내용을 삽입합니다 |
| insertAfter() | 선택된 요소 뒤에 HTML 요소를 삽입합니다 |
| insertBefore() | 선택된 요소 앞에 HTML 요소를 삽입합니다 |
이 메서드들은 요소를 DOM에서 제거할 수 있게 합니다:
| 메서드 | 설명 |
|---|---|
| detach() | 선택된 요소를 제거합니다(데이터와 이벤트 유지) |
| empty() | 선택된 요소에서 모든 자식 노드(텍스트 노드 포함)를 제거합니다 |
| remove() | 선택된 요소(데이터와 이벤트 포함)를 제거합니다 |
| unwrap() | 선택된 요소의 부모 요소를 제거합니다 |
이 메서드는 DOM에서 내용을 제거하고 새로운 내용으로 대체합니다:
| 메서드 | 설명 |
|---|---|
| replaceAll() | 새로운 HTML 요소로 선택된 요소를 대체합니다 |
| replaceWith() | 선택된 요소를 새로운 내용으로 대체합니다 |
이 메서드는 요소의 DOM 속성을 가져오고 설정합니다:
| 메서드 | 설명 |
|---|---|
| attr() | 선택된 요소의 속성을 설정하거나 반환합니다/값 |
| prop() | 선택된 요소의 속성을 설정하거나 반환합니다/값 |
| removeAttr() | 선택된 요소에서 하나나 여러 개의 속성을 제거합니다 |
| removeProp() | prop() 메서드로 설정된 속성을 제거합니다 |
| val() | 선택된 요소의 value 속성을 설정하거나 반환합니다. (폼 요소에 대해서) |
이 메서드는 요소의 CSS 관련 속성을 가져오고 설정합니다:
| 메서드 | 설명 |
|---|---|
| css() | 선택된 요소에 하나나 여러개의 스타일 속성을 설정하거나 반환 |
| height() | 선택된 요소의 높이를 설정하거나 반환 |
| innerHeight() | 요소의 높이를 설정하거나 반환(패딩 포함, 경계, 선택된 여백 제외) |
| innerWidth() | 요소의 너비를 설정하거나 반환(패딩 포함, 경계, 선택된 여백 제외) |
| offset() | 선택된 요소의 기준 문서에서의 위치를 설정하거나 반환 |
| offsetParent() | 처음으로 위치가 설정된 부모 요소를 반환 |
| outerHeight() | 요소의 높이를 설정하거나 반환(패딩, 경계, 선택된 여백 포함) |
| outerWidth() | 요소의 너비를 설정하거나 반환(패딩, 경계, 선택된 여백 포함) |
| position() | 요소가 부모 요소에서의 위치를 반환 |
| scrollLeft() | 선택된 요소의 수평 스크롤 위치를 설정하거나 반환 |
| scrollTop() | 선택된 요소의 세로 스크롤 위치를 설정하거나 반환 |
| width() | 선택된 요소의 너비를 설정하거나 반환 |