• Q&A
  • 회원가입
  • 로그인

[JS-서기] JS 14강 - HTML CSS JS 혼용하기 (=getElementsBy 시리즈 = JS선택자) ★★★★★

167  


 

예제

 

<style>

 .hz{display:none;}

</style>



<div class='hz' id='sinbi'>

홈짱닷컴 Homzzang.com

</div>


<input type='button' value='클릭' onclick='homzzang()'>


<script>

function homzzang() {

   document.getElementById('sinbi').style.display='block';

   location.href='https://homzzang.com';

}

</script>


결과 보기

 

 

 

주의 - display:none 속성 정의된 hz 클래스로 제어 불가

 

<style>

.hz{display:none;}

</style>



<div class='hz'>

홈짱닷컴 Homzzang.com

</div>


<input type='button' value='클릭' onclick='homzzang()'>


<script>

function homzzang() {

   document.getElementsByClassName('hz').style.display='block';

   location.href='https://homzzang.com';

}

</script>



결과 보기

 

 

 

JS 선택자

 

document.getElementById("아이디");

document.getElementsByTagName("태그이름");

document.getElementsByClassName("클래스");
document.querySelectorAll("선택자");
document.forms["폼아이디"];

 

JS 선택자 자세히보기

※ 대소문자 구별 주의

※ 태그 및 클래스는 중간에 복수형 s 들어감에 주의.

※ querySelectorAll() 메서드는 IE8 이하에선 작동 안 함.



이름
비밀번호
자동등록방지

방문자 수

오늘 501
어제 885
최대 2,271
전체 865,840
Since 2012