728x90
반응형
remove() 지우기
empty() 비우기
detach() 잘라내기
1. body
<body>
<h1>엘리먼트 제거하기</h1>
<div>
<p>remove</p>
<p>empty</p>
<p>detach</p>
</div>
</body>
2. script
<style type="text/css">
div{border:2px solid red; width:200px; padding: 10px 10px;}
p{background: yellow;}
h1{border: 1px solid blue;}
</style>
<script type="text/javascript" src="resources/js/jquery-3.5.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:eq(0)").click(function(){
$(this).remove(); // 지우기
});
$("p:eq(1)").click(function(){
$(this).parent().empty(); //비우기
});
$("p:eq(2)").click(function(){
//detach : 잘라내기
var p = $(this).detach();
$("h1").append(p);
});
});
</script>728x90
반응형
'Web > JQuery' 카테고리의 다른 글
| [JQ]ajax_02 (0) | 2020.08.05 |
|---|---|
| [JQ]ajax_01 (0) | 2020.08.05 |
| [JQ]wrap (0) | 2020.08.05 |
| [JQ]외부삽입 (0) | 2020.08.04 |
| [JQ]setInterval() (0) | 2020.08.04 |
