

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel = "stylesheet" href = "../css/mystyle.css" type="text/css">
<script src="../js/jquery-3.6.0.min.js"></script>
<script>
$(function(){
$('.pp').on('click', function(){
$(this).css('font-size', '+=3px');
})
$('#clone').on('click', function(){
vp1 = $('#p1').clone()
$('#result1').append(vp1);
})
$('#eclone').on('click', function(){
vp2 = $('#p2').clone(true);
vp2.appendTo($('#result2'));
})
})
</script>
</head>
<body>
<div class = "box">
clone : 이벤트 처리기는 복사되지 않고 요소만 단순 복사된다<br>
clone(true) : 복사 시 이벤트 처리기가 함께 복사된다<br>
<br>
<p class="pp" id ="p1">무궁화 꽃이 피었습니다1</p>
<p class="pp" id ="p2">무궁화 꽃이 피었습니다2</p>
<button type = "button" id="clone">복사</button>
<button type = "button" id="eclone">이벤트복사</button>
<div id = "result1"></div>
<div id = "result2"></div>
</div>
</body>
</html>
