본문 바로가기

Development/Javascript

2장 HTML 속의 자바스크립트

1. <script>요소

  1.1. Async - 옵션 : 스크립트를 즉시 내려받지만 자원을 내려받거나 다른 스크립트를 불러오는 등 다른 페이지 작업을 방해해서는 안된다고 지시함. 외부 스크립트 파일을 불러올 때만 유효함

  1.2. Charset - 옵션 : src속성으로 명시한 코드의 문자셋을 지정함. 브라우저는 대게 이 속성값을 무시하므로 좀처럼 쓰이지 않음

  1.3. defer - 옵션 : 문서의 컨텐츠를 완전히 파싱하고 표시할때까지 스크립트 실행을 지연해도 안전함을 나타냄. 외부 스크립트 파일을 불러올 때만 유효함

  1.4. language - 폐기됨

  1.5. src - 옵션 : 실행할 코드를 포함한 외부 파일의 위치를 지정함

  1.6. type - 옵션 : 스크립트 컨텐츠 타입(마임타입)을 지정함. 자바스크립트 파일은 일반적으로 "application/x-javascript" 마임타입으로 전송되므로 type속성을 명시적으로 지정하면 스트립트가 무시될 가능성도 있음.

2. <script>요소는 인라인 자바스크립트와 src를 이용한 외부파일을 불러오는 두가지 방식으로 사용됨(외부파일은 반드시 지켜야할 요건은 아니지만 서버에서 파일 확장자를 기준으로 응답에 사용할 마임타입을 경정하기 때문에 .js라는 확장자를 사용하는게 좋다)


3. 자바스크립트 파일은 보통 <head>요소에서 많이 사용하지만 많은 파일을 불러오게 하면 자바스크립트 코드를 전부 내려받고 파싱하고 해석이 끝날때까지 페이지 렌더링이 멈추기때문에 적절한 분배가 필요함


4. 지연시킬 스크립트는 <body>요소의 맨 마지막에 위치하는것이 가장 좋은 방법임


5. XHTML이 지원되지 않는 브라우저에서의 인라인 스크립트 사용법은 

  <script type="text/javascript">

  //<![CDATA[ 

    ~~~~~~

    ~~~~~~

  //]]>

  </script>

  형태로 사용함


6. XHTML 모드에서는 <!-- //-->패턴도 유효한 XML주석이므로 스크립트를 무시함


7. HTML파일예 자바스크립트를 직접 써도 되긴하지만 일반적으로 가능한 자바스크립트는 외부 파일로 분리하는 방법이 좋음


8. 문서 모드는 쿽스모드, 표준모드, 거의 표준모드로 동작함

  - 문서의 시작 부분에 독타입(doctype)을 쓰지 않으면 모든 브라우저는 쿽스모드를 사용함

  - 표준모드 독타입(doctype)

    . <!-- HTML 4.01 Strict -->

       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

        "http://www.w3.org/TR/html4/strict.dtd">

    . <!-- XHTML 1.0 Stric -->

      <!DOCTYPE Html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

       "http://www.w3.org/TR/xhtml/DTD/xhtml1-strict.dtd">

    . <!-- HTML5 -->

      <!DOCTYPE html>

  - 거의 표준모드 독타입(doctype)

    . <!-- HTML 4.01 Transitional -->

      <!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Transitional//EN"

       "http://www.w3.org/TR/html4/loose.dtd">

    . <!-- HTML 4.01 Frameset -->

      <!DOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01 Frameset//EN"

       "http://www.w3.org/TR/html4/frameset.dtd">

    . <!-- XHTML 1.0 Transitional -->

      <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Transitional//EN"

       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    . <!-- XHTML 1.0 Frameset -->

      <!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Frameset//EN"

       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">


9. <noscript>요소는 브라우저가 스크립트를 지원하지 않거나 비활성화되었을때 내용을 표시하기 위해 사용됨(<noscript>요소의 콘텐츠는 브라우저에서 스크립트를 사용 할 수 있을 때는 절대로 표지되지 않음)


출처 : "프론트엔드 개발자를 위한 자바스크립트 프로그래밍" 책에서

'Development > Javascript' 카테고리의 다른 글

3장 언어의 기초  (0) 2014.03.25
1장 자바스크립트란 무엇인가?  (0) 2014.03.25