[jQuery] jQuery empty 메소드를 사용하여 이미지 요소 초기화
jQuery의 empty
메소드는 선택한 요소의 모든 하위 요소를 제거하는 데 사용됩니다. 예를 들어, 이미지 요소를 초기화할 때 유용하게 활용될 수 있습니다.
이미지 요소 초기화 예제
다음은 이미지 요소를 초기화하는 간단한 예제입니다.
<!DOCTYPE html>
<html>
<head>
<title>이미지 초기화 예제</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
$("#clearBtn").click(function(){
$("#imageContainer").empty();
});
});
</script>
</head>
<body>
<div id="imageContainer">
<img src="image1.jpg" alt="이미지 1">
<img src="image2.jpg" alt="이미지 2">
</div>
<button id="clearBtn">이미지 초기화</button>
</body>
</html>
위의 예제에서는 empty
메소드를 사용하여 imageContainer
안의 모든 이미지 요소를 제거하는 버튼을 만듭니다. 페이지를 열고 버튼을 클릭하면 이미지가 초기화됩니다.
이 예제에서는 이미지 요소를 제거하지만, 다른 상황에서 필요에 따라 다양한 요소를 초기화하는 데 활용할 수 있습니다.
결론
empty
메소드를 사용하여 jQuery를 활용하면 선택한 요소의 모든 하위 요소를 간편하게 제거할 수 있습니다. 이를 활용하여 이미지 요소뿐만 아니라 다양한 요소를 초기화할 수 있습니다.