Javascript 풀스택개발자 삽질로그 002. Hello World! 자바스크립트로 첫 프로그래밍하기

2019-12-25 Devlog Javascript DevStudy FullStack

“script” 태그

HTML문서에서 자바스크립트를 사용할때 쓰는 방법. script 태그를 이용하면 자바스크립트 프로그램을 HTML 문서 어느 곳에나 삽입할 수 있다.


<!DOCTYPE HTML>
<html>

<body>

  <p>스크립트 전</p>

  <script>
    alert( 'Hello, world!' );
  </script>

  <p>스크립트 후</p>

</body>

</html>

모던 마크업

script 태그엔 몇 가지 속성(attribute)이 있다. 요즘엔 잘 사용하진 않지만, 오래된 코드에서 종종 이 속성을 발견할 수 있습니다.


type 속성: <script type=…>

HTML4에선 스크립트에 type을 명시하는 것이 필수였습니다. 따라서 type=”text/javascript” 속성이 붙은 스크립트를 어렵지 않게 찾을 수 있었습니다. 이젠 타입 명시가 필수가 아닙니다. 게다가 모던 HTML 표준에선 이 속성의 의미가 바뀌었습니다. 이제 이 속성은 자바스크립트 모듈에 사용할 수 있습니다. 모듈은 심화 내용이기 때문에 다른 파트에서 다시 이야기하도록 하겠습니다.

language 속성: <script language=…>

이 속성은 현재 사용하고 있는 스크립트 언어를 나타냅니다. 지금은 자바스크립트가 기본 언어이므로 속성의 의미가 퇴색된 상황입니다. 더는 사용할 필요가 없어졌죠.

스크립트 전후에 위치한 주석 아주 오래된 책과 가이드에서는 다음과 같이 script 태그 안에 주석이 존재하는 걸 볼 수 있습니다.

<script type="text/javascript"><!--
    ...
//--></script>

모던 자바스크립트에선 이런 트릭을 사용하지 않습니다. 태그 옆에 붙은 주석은 script 태그를 처리하지 못하는 브라우저가 해당 스크립트를 읽지 못하게 하려고 사용했었죠. 지난 15년간 출시된 브라우저는 script 태그를 처리할 수 있으므로, 이런 형태의 주석을 보면 아주 오래된 코드라는 사실을 알 수 있습니다.