Notice
Recent Posts
Link
- Today
- Total
hye-log
[노마드코더]바닐라JS로 크롬 앱 만들기 (16)HTML의 id getElementById로 불러오기 본문
NomadCoder/(JS)크롬 앱 만들기
[노마드코더]바닐라JS로 크롬 앱 만들기 (16)HTML의 id getElementById로 불러오기
iihye_ 2022. 2. 18. 15:30Javascript로 정보를 가져오기 위해서 document의 object와 element를 가져오는 수많은 함수들을 이용할 수 있다.
먼저 index.html의 <body>에 <h1> 태그를 이용하여 title을 id로 가지도록 정의한다.
title은 console 창이나 app.js에서 불러올 수 있다.
1) console 창에서document.getElementById("title") 로 불러오기
getElementById는 id를 통해 element를 찾아오는 기능을 한다.
2) app.js 에서 document.getElementById("title")로 불러와서 변수에 저장한 뒤 console에 출력하기
이때, console.dir 를 사용하면 element를 더 자세하게 보여준다.
만약 Grab me! 라고 정의한 title을 바꾸고 싶다면, title.innerText를 통해 내용을 바꿀 수 있다.
console이 아닌 elements를 보면 title의 내용이 바뀐 것을 확인할 수 있다.
728x90
'NomadCoder > (JS)크롬 앱 만들기' 카테고리의 다른 글
| [노마드코더]바닐라JS로 크롬 앱 만들기 (18)Event Listen하기 (0) | 2022.02.19 |
|---|---|
| [노마드코더]바닐라JS로 크롬 앱 만들기 (17)querySelector로 HTML element 가져오기 (0) | 2022.02.19 |
| [노마드코더]바닐라JS로 크롬 앱 만들기 (15)Jacascript는 이미 HTML에 연결되어 있다! (0) | 2022.02.18 |
| [노마드코더]바닐라JS로 크롬 앱 만들기 (14)Recap: conditions (0) | 2022.02.18 |
| [노마드코더]바닐라JS로 크롬 앱 만들기 (13)Conditions로 true/false 경우 나누기 (0) | 2022.02.18 |
'NomadCoder/(JS)크롬 앱 만들기' Related Articles
more
Comments