728x90
반응형
◎ display의 상태를 확인하여 보여줄지 감출지 선택할 수 있습니다.
1 2 3 4 5 6 | if($("#dis").css("display") == "none"){ $("#dis").show(); } else { $("#dis").hide(); } | cs |
◎ 일반 자바스크립트로 할 경우
1 | obj.style.display = (obj.style.display = none) ? "" : ""; | cs |
◎ 예시
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <!DOCTYPE html> <html> <head> <title>테스트</title> <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script type="text/javascript"> function dis(){ if($('#dis').css('display') == 'none'){ $('#dis').show(); }else{ $('#dis').hide(); } } </script> </head> <body> <img id='dis' src="error.jpg" width="500" height="300" display='none'> <button id='show' onclick="dis()">show</button> </body> </html> | cs |
See the Pen bzyLBo by 유호준 (@ToxicNuke) on CodePen.
반응형
'Programming > HTML&JAVASCRIPT&JQuery' 카테고리의 다른 글
| <jQuery,Javascript> 쿠키(Cookie)를 이용한 ID 저장하기. (0) | 2018.10.11 |
|---|---|
| <JQuery> jQuery를 사용하여 readonly, disabled 설정하기! (2) | 2018.10.11 |
| <html> input 태그가 하나만 있을 때 엔터를 치면 submit되는 현상 막기 (2) | 2018.10.11 |
| <HTML> textarea에 값을 넣어보자! (3) | 2018.10.11 |
| [HTTrack] HTTrack 크롤러를 설치하고 사용해보자! (2) | 2018.05.08 |
