HTML <script> 태그

정의 및 특징

・<script> 태그는 자바스크립트와 같은

　클라이언트 사이드 스크립트(client-side scripts)를 정의할 때 사용한다

 

・<script> 요소는

　스크립트 코드를 요소 내부에 직접 명시하거나

　src 속성을 사용하여 외부 스크립트 파일을 참조할 수 있다

　하지만 src 속성이 명시된 <script> 요소에는

　스크립트 코드를 직접 명시해서는 안 된다

 

・참조된 외부 스크립트 파일을

　다음과 같이 여러 가지 방법으로 실행시킬 수 있다

　- async 속성이 명시된 경우

　　브라우저가 페이지를 파싱 되는 동안 스크립트가 실행됨

　- async 속성은 명시되어 있지 않고 defer 속성만 명시된 경우

　　브라우저가 페이지의 파싱을 모두 끝내면 스크립트가 실행됨

　- async 속성과 defer 속성이 모두 명시되어 있지 않은 경우

　　브라우저가 페이지를 파싱 하기 전에 스크립트를 가져와 바로 실행시킴

 

・또한, <noscript> 요소를 사용하여

　클라이언트 사이드 스크립트(client-side scripts)를 사용하지 않도록 설정했거나

　스크립트를 지원하지 않는 브라우저를 위한 별도의 콘텐츠를 정의할 수 있다

 

・HTML과 XHTML에서의 차이점

　XHTML에서는 <script> 요소의 콘텐츠를 CDATA가 아닌 PCDATA로 선언한다

　※CDATA(Character DATA)란

　　XML 파서가 분석하지 않는 문자 데이터를 의미하여

　　PCDATA(Parsed Character DATA)란

　　XML 파서에 의해 분석될 문자 데이터를 의미한다

　따라서 XHTML에서는 모든 특수 문자를 인코딩하거나,

　다음 예제와 같이 CDATA 영역으로 감싸주어야 한다

<script>
<!--
function alertMsg() {
  alert("Hello World!")
}
//-->
</script>

 

 

지원하는 브라우저

1.0	지원함	지원함	1.0	지원함	지원함

 

속성

속성명	속성값	설명
async	async	스크립트가 비동기적으로 실행됨을 명시한다 (단, <script> 요소가 외부 스크립트를 참조하는 경우에만 사용) HTML5에서 새롭게 추가된 속성
charset	문자셋	외부 스크립트 파일에서 사용되는 문자 인코딩 방식을 명시한다 (단, <script> 요소가 외부 스크립트를 참조하는 경우에만 사용)
defer	defer	페이지의 파싱이 모두 끝나면 스크립트가 실행됨을 명시한다 (단, <script> 요소가 외부 스크립트를 참조하는 경우에만 사용)
src	URL	외부 스크립트 파일의 URL을 명시한다
type	미디어 타입	스크립트의 미디어 타입을 명시한다
xml:space	preserve	스크립트 코드 내의 공백 문자(whitespace)의 보존 여부를 명시한다 HTML5에서는 더 이상 지원하지 않는다

 

예제

<script type="application/javascript">
    document.getElementById("para").innerHTML = "자바스크립트가 실행되었습니다!";
</script>

 

 

■HTML 태그 레퍼런스

HTML 태그 레퍼런스 - MAIN 돌아가기