JS_purpose - hxngxS님의 블로그 - 인프런

JS_purpose

hxngxS 2022.02.23

자바스크립트는 사용자와 상호작용하는 언어이다.

자바스크립트를 이용해 버튼을 누르면 자바스크립트 코드에 따라 <body> 태그의 style 속성이 추가되며, 이를 통해 <body> 태그의 디자인을 바꿀 수 있다.

자바스크립트는 HTML을 제어하는 언어다.

ex1.html 파일 생성

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    
  </body>
</html>

HTML에 자바스크립트 코드가 시작된다는 사실을 알려야 한다. <script> 태그 사용.

<script> 태그와 자바스크립트 코드 작성

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <script>
      document.write('hello world');
    </script>
  </body>
</html>

<h1> 태그와 제목 추가

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <h1>JavaScript</h1>
    <script>
      document.write('hello world');
    </script>
  </body>
</html>

HTML 태그와 자바스크립트의 차이 살펴보기

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <h1>JavaScript</h1>
    <script>
      document.write(1+1);
    </script>
    <h1>html</h1>
    1+1
  </body>
</html>

HTML에서 '1+1'을 쓰면 영원히 '1+1'이 나온다. 하지만 자바스크립트는 동적이다. 계산기처럼 동작할 수 있다.