13d_DOM 명령어

doggoddog·2020년 8월 30일

일일 정리

목록 보기
17/34

DOM 명령어

tagName 태그 이름
id id
classList class 목록
className class 문자열
innerHTML 엘리먼트에 담긴 내용 tag까지 싹 다
textContent 앨리먼트 내용
innerText only텍스트만
value form 입력 값
children 자식 엘리먼트
parentElement 부모 엘리먼트
childNodes 자식 노드
dataset data- 속성에 담긴 값/tag에 정보를 넣어두고 싶을 때 data-를 사용
attributes 속성 객체
style 스타일 객체

getElementsByTagName 태그 이용
getElementById id 이용 //id는 유니크하기 때문에 Element에 s가 안붙음
getElementsByClassName class 이용

querySelector
querySelectorAll 이거 두개로 위에꺼 다 커버 가능 /querySelector는 앞에 class id에 따라 . #을 붙이지만 getElement는 이미 명령어에 명시했기때문에 class나 id의 이름만 입력한다

remove

<body>
...
<script src="script.js"></script> //바디가 끝나기 직전에 자바 스크립트 삽입
</body>

cheat sheet //한 눈에 보는 자료
vanilla javascript dom manipulation cheat sheet

document.body

profile
----------------------------

0개의 댓글