본문 바로가기

Programming/JavaScript

식별자 API

식별자 : 엘리먼트들을 식별할 수 있는 , 제어할 수 있는 것

Element 객체의 식별자 API

Element.tagName                            //  해당 엘리먼트의 태그 이름을 알아낸다.(태그이름 변경은 불가)

ex)

<ul>

<li id="active" class="important current">JavaScript</li>

</ul>

<script>

console.log(document.getElementById('active').tagName)

</script>



li태그를 이용해 active라는 id를 가진 엘리먼츠를 먼저 선언하고
getElementById를 통해 'active'라는 ID를 가진 엘리먼트 조회 ,             .tagName을 이용해 해당 엘리먼트의 태그네임(li) 확인가능





Element.id                //문서에서 id는 단 하나만 등장할 수 있는 식별자다. 아래 예제는 id값을 읽고 변경하는 방법을 보여준다.

<ul>

<li id="active">JavaScript</li>                                //id 식별자가 active

</ul>

<script>

var active = document.getElementById('active');                        //getElementById를 통해 Id가 active인 엘리먼트를 active 변수에 담는다

console.log(active.id);                                                          //콘솔에 id를 띄운다.        active출력

active.id='deactive';                                                            //active.id를 deactive로 수정

console.log(active.id);                                                          //콘솔에 id를 띄운다.        deactive출력

</script>



보는바와 같이 id식별자는 변경이 가능하다.





Element.className                                        //클래스는 여러개의 엘리먼트를 그룹핑할 때 사용한다.



Element.classList                                            //className에 비해서 훨씬 편리한 사용성을 제공한다.



'Programming > JavaScript' 카테고리의 다른 글

Node의 관계 API  (0) 2017.11.07
jQuery 속성 제어 API  (0) 2017.11.07
jQuery 객체  (0) 2017.11.06
jQuery  (0) 2017.11.06
제어 대상 찾기 ( getElementById )  (0) 2017.11.06