WEB.JQUERY

chapter02 : jQuery_selector

GAWON 2023. 5. 22. 09:20
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="js/jquery-3.4.1.js"></script>
<script type="text/javascript">
	$(function(){
		$("#idBtn").click(function(){
			$("#pa").hide();	// 요소 숨길 때
			//$("#pa").show();	// 요소 보여줄 때
		});
		// 클래스 숨기기 버튼 클릭 시  클래스 명이 "pb" 인 요소 숨기기
		$("#classBtn").click(function(){
			$(".pb").hide();
		});
		// 태그 숨기기 버튼 클릭 시 h2 태그 숨기기
		$("#tagBtn").click(function(){
			$("h2").hide();
		});
	});
</script>
</head>
<body>
	<h2>여기가 h 태그</h2>
	<p id="pa">여기가 p 태그</p>
	<p class="pb">여기가 또 다른 p 태그</p>
	<button id="idBtn">아이디 숨기기 버튼</button>
	<button id="classBtn">클래스 숨기기 버튼</button>
	<button id="tagBtn">태그 숨기기 버튼</button>
</body>
</html>