[JavaScript] HTML,CSS 객체에 접근할때!
2021. 3. 5. 04:54ㆍProgram/JavaScript
가져오고....
document.getElementById : id로 지정된 값을 가져온다
document.getElementByClassName : class로 지정된 값을 가져온다
docement.getElementByTagName : Tag 값을 가져온다
.... 등등등 ...
document.querySelctor("#이름"); id로 지정된 값을 가져온다
document.querySelctor(".이름"); class로 지정된 값을 가져온다
document.querySelctor("태그이름"); tag로 지정된 값을 가져온다.... 등등등 ...
내보내고...
변수이름.innerHTML = 실행값
변수이름.style.color = "red"
document.title = 실행값.... 등등등....
예제)
// HTML
<h1 id="title">Welcome</h1>
HTML에서 h1태그에 'Welcome'이라는 문자열 값을 가지고 있지만,
// JavaScript
const title = docement.getElementById("title")
title.innerHTML = "Good Bye!"
자바스크립트에서 h1 태그의 id값을 가져와서.
innerHTML을 사용하여 h1태그에 접근해 'Good Bye!'라는 문자열로 변경할 수 있다.
'Program > JavaScript' 카테고리의 다른 글
| [JavaScript] 미니(inline) 조건문 (0) | 2021.03.05 |
|---|---|
| [JavaScript] .addEventListener (0) | 2021.03.05 |
| [JavaScript] (`) 백틱(backtick)과 템플릿 리터럴 (0) | 2021.03.05 |
| [JavaScript] 자바스크립트에서 배열을 만드는 방법 Array, Object (0) | 2021.03.04 |
| [JavaScript] 자바스크립트 변수(상수)생성 방법 let, var, const (0) | 2021.03.02 |