대부분 작업의 편의성을 위해 html과 js 파일을 따로 작업한다.
html의 <body>태그 안에 <script src="파일이름.js"></script>를 넣어주었다.
이때, 다음과 같이 js에서도 html의 <body>안에 넣을 태그를 작성할 수 있다.
| var example = document.body; var word = document.createElement('div'); word.textContent = '예제'; document.body.append(word); |
document.body를 통해 html 파일의 <body>태그를 선택해준다.
여기서 createElement는 document객체의 메서드이다. (태그를 생성하는 메서드)
또한 textContent라는 메서드를 통해 word 변수에 '예제'라는 문자열을 넣어주었다.
마지막줄에서 word를 인자로 넣어 body.append를 실행하면 body 안에 비로소 태그가 삽입된다.
html 파일을 브라우저에서 실행하면 다음과 같다.
<tip>
createElement로 태그를 만들었으면 항상 body.append로 body 안에 넣어줘야함을 잊지말자!
'공부 > Java script' 카테고리의 다른 글
| [JavaScript]함수표현식과 함수선언문 (0) | 2021.10.21 |
|---|---|
| [Java Script]원시타입과 객체타입 (0) | 2021.10.20 |
| 자바스크립트로 숫자야구게임 만들기(2) (0) | 2021.01.23 |
| 자바스크립트로 숫자야구게임 만들기(1) (0) | 2021.01.19 |
| EventListener가 반복문 역할을 하게 만들기 (0) | 2021.01.11 |
