JavaScript

[생활코딩 JavaScript] 3강. HTML에서 자바스크립트 사용하기

인팁구름 2023. 4. 7. 16:11

저번 게시물에도 있지만,

자바스크립트는 기본적으로 HTML "위에서" 동작하는 언어이다.

 

그렇다면,

어떻게 하면 HTML이라는 언어에 완전히 다른 문법을 가지고 있는 JavaScript를 넣을 것인가? 를 배워보자💌

 


 

 

1. 웹 브라우저한테 HTML 코드로 지금부터 JavaScript가 시작됩니다~ 하고 알려주기

<script> 태그를 이용해서!

<script> 태그는

태그 안쪽에 자바스크립트가 오도록 약속되어 있기 때문에,

웹 브라우저는 <script> 태그 안쪽에 있는 코드를 자바스크립트로 해석한다.

 

 

 

2. JavaScript 코드 작성하기

 

 

document 이 문서에

write 쓸 거임

"hello world"를!

(자바스크립트는 작은 따옴표와 큰 따옴표 구분 없다! 'hello world' 라고 써도 오류가 아니며, 결과도 같다)

이러면 웹에 hello world 라는 텍스트가 찍힌다

 

 

하지만 이 결과는 자바스크립트로 쓰든, 그냐야 HTML에 쓰든 결과가 똑같지 않은가?

도대체 어떤 차이가 있냐?! 🤔

 

 

1+1을 자바스크립트와 HTML에 써 보았다.

HTML은 "1+1" 텍스트 자체가 나오고,

자바스크립트는 1+1의 결과값인 2가 출력되었다.

 

자바스크립트는 동적이기 때문에 계산기처럼 작동을 한 것이다.

반면에 HTML은 정적이기 때문에 입력된 값이 변하지 않았다.

 

지금은 자바스크립트 문법 , 1+1 이런 게 뭔지 알려고 하지 말고

중요한 것은 <script> 태그 안에 있는 코드들이 자바스크립트 코드라는 것,

자바스크립트로 웹 페이지에 글씨를 출력할 때는 document.write를 쓴다는 정도만 기억하자! 😉