📝 jQuery
🖥️ 1. .hide() .show() 메소드
- .toggle() 메소드와 다르게 속도를 조절할 수 있다.
EX)
<head>
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/
3.7.0/jquery.min.js"></script>
</head>
<body>
<h1>.hide() .show() 메소드</h1>
<p>
<button id="btnHide">문장 숨기기</button>
<button id="btnShow">문장 표시하기</button>
</p>
<div>안녕하세요. jQuery입니다.</div>
<script>
$("#btnHide").on("click", function(){
$('div').hide(1000);
})
$("#btnShow").on("click", function(){
$('div').show("fast");
})
</script>
</body>
🖥️ 2. .toggle() 메소드
- .hide() .show() 메소드보다 코드가 간결하다.
EX)
<head>
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/
3.7.0/jquery.min.js"></script>
</head>
<body>
<h1>.toggle() 메소드</h1>
<p>
<button id="btnToggle">문장토글</button>
</p>
<div>안녕하세요, jQuery입니다.</div>
<script>
$("#btnToggle").on("click", function(){
$("div").toggle(1000);
});
</script>
</body>