heeestorys :: [jQuery] 요소 내용 삭제/비우기

[jQuery] 요소 내용 삭제/비우기 - remove(), empty()

Front-End/jQuery 2017. 1. 4. 17:33

요소 내용 삭제/비우기 - remove(), empty()

1. remove()

- 페이지 안의 요소를 삭제 한다

- 변경 전

- 변경 후

<!DOCTYPE html> <head> <meta charset="UTF-8"> <title>Title</title> <style> #hat{ width:100px; background-color : aquamarine; } ul{ border: 1px solid black; width:100px; height:100px; list-style: none; padding:0; margin:0; } li{ border-bottom-style: dotted; } </style> </head> <div id="hat"> hat </div> <ul > <li>shirt</li> <li>pants</li> </ul> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script> $(function(){ $('#hat').remove(); }); </script>

2. empty()

- 요소 삭제가 아닌 요소 안의 내용이 삭제된다

- 변경 전

- 변경 후

<!DOCTYPE html> <head> <meta charset="UTF-8"> <title>Title</title> <style> #hat{ width:100px; height:50px; background-color : aquamarine; } ul{ border: 1px solid black; width:100px; height:100px; list-style: none; padding:0; margin:0; } li{ border-bottom-style: dotted; } </style> </head> <div id="hat"> hat </div> <ul > <li>shirt</li> <li>pants</li> </ul> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script> $(function(){ $('#hat').empty(); }); </script>

'Front-End > jQuery' 카테고리의 다른 글

[jQuery] 제이쿼리 주요 이벤트 리스너와 예제 (0)	2017.01.05
[jQuery] 표준 요소를 jQuery 객체로 변환 - $() (0)	2017.01.04
[jQuery] 기존의 요소 변경 - replaceAll(), replaceWith() (0)	2017.01.04
[jQuery] 요소 삽입/이동 - insertBefore(), insertAfter(), prependTo(), appendTo() (1)	2017.01.04
[jQuery] 특정 요소 범위에 한정하여 다른요소 검색 - find() (0)	2017.01.03

리딩리드

일	월	화	수	목	금	토
					1	2
3	4	5	6	7	8	9
10	11	12	13	14	15	16
17	18	19	20	21	22	23
24	25	26	27	28	29	30

[jQuery] 요소 내용 삭제/비우기 - remove(), empty()

'Front-End > jQuery' 카테고리의 다른 글

공지사항

카테고리

태그목록

글 보관함

달력

링크

리딩리드

LATEST FROM OUR BLOG

LATEST COMMENTS

BLOG VISITORS

티스토리툴바