[jQuery] 요소 삽입/이동 - insertBefore(), insertAfter(), prependTo(), appendTo()
Front-End/jQuery 2017. 1. 4. 16:46
요소 삽입 - insertBefore(), insertAfter(), prependTo(), appendTo()
1. insertBefore(), insertAfter(), prependTo(), appendTo()
1) 기본 형태
- $('삽입요소').method('삽입셀렉터')
- '<' 로 시작하고 '>'로 끝나야한다
- <br/>은 안됨
2) 메소드
- insertBefore(): 요소 삽입할 곳 앞에 추가
- insertAfter() : 요소 삽입할 곳 뒤에 추가
- prependTo() : 요소를 삽입할 곳의 자식요소 앞부분추가
- appendTo() : 요소를 삽입할 곳의 자식요소 끝에 추가
3) 예제
2. before(), after(), prepend(), append()
1) 기본형태
- $('삽입 셀렉터').method('삽입 요소')
- 위의 함수와 비슷하지만 위치만 바뀌게 된다
2) 예제
- 결과는 같다
3. 요소를 이동하라
- 위의 함수를 이용하여 요소를 이동할 수 있다
1) 예제
변경 전
변경 후
- $('#cool').insertBefore('#list');
'Front-End > jQuery' 카테고리의 다른 글
| [jQuery] 요소 내용 삭제/비우기 - remove(), empty() (0) | 2017.01.04 |
|---|---|
| [jQuery] 기존의 요소 변경 - replaceAll(), replaceWith() (0) | 2017.01.04 |
| [jQuery] 특정 요소 범위에 한정하여 다른요소 검색 - find() (0) | 2017.01.03 |
| [jQuery] html() vs text() 의 차이 (0) | 2017.01.03 |
| [jQuery] 제이쿼리를 이용하여 요소의 속성 읽기/설정 - attr(), prop() (0) | 2017.01.03 |
리딩리드