728x90
before()와 insertBefore() 메서드는 선택한 요소의 이전 위치에 새 요소를 생성하고
after() 와 insertAfter() 메서드는 선택한 요소의 다음 위치에 새 요소를 생성한다.
* 기본형
| $("요소 선택").before("새 요소"); $("새 요소").insertBefore("요소 선택"); $("요소 선택").after("새 요소"); $("새 요소").insertAfter("요소 선택"); |
* 예제
| <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title> 객체 조작 및 생성 </title> <script src="js/jquery.js"></script> <script> $(function( ){ $("#wrap p:eq(2)").after("<p>After</p>"); $("<p>insertAfter</p>").insertAfter("#wrap p:eq(1)"); $("#wrap p:eq(1)").before("<p>Before</p>"); $("<p>insertBefore</p>").insertBefore("#wrap p:eq(0)"); }); </script> </head> <body> <div id="wrap"> <p>내용1</p> <p>내용2</p> <p>내용3</p> </div> </body> </html> |
'내마음대로만들어보자 > JS' 카테고리의 다른 글
| clone() / empty() / remove() 메서드 (0) | 2021.08.21 |
|---|---|
| append() / appendTo() / prepend() / prependTo() 메서드 (0) | 2021.08.21 |
| 스크롤바 위치 메서드 scrollTop() / scrollLeft() (0) | 2021.08.21 |
| 요소 위치 메서드 - position() / offset() (0) | 2021.08.21 |
| 수치조작메서드 (0) | 2021.08.21 |
