[정의]
.show(). / .hide()
.show()는 요소의 css가 display:none; 일 때 요소를 display:block;으로 바꿔주는 함수
.hide()는 display:block;->display:none;
[예제]
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p>If you click on the "Hide" button, I will disappear.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
</html>
[구현]
출처 : https://www.w3schools.com/jquery/jquery_hide_show.asp
jQuery Effects - Hide and Show
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com
'J query' 카테고리의 다른 글
J query : scrollTop(); 스크롤바 수직 위치 설정 (0) | 2022.11.28 |
---|---|
J Query: prop() - 속성 값을 가져오거나 추가하는 메서드 (0) | 2022.04.27 |
J Query : Dom 요소 제어 (0) | 2022.04.07 |
J Query: ajax 이용하여 데이터 불러오기 (0) | 2022.04.07 |