HTML_가져오기, 사용하기 (feat. script, link)

우리가 HTML로 작업을 하다보면 여러가지 툴이나 파일들을 불러와야 하는 경우가 자주 생긴다.

대표적인 예시로 JavaScript를 body나 문서 내에 작성할 수 있지만

Js파일로 따로 작성해 보기 좋게 만들 수 있다.

또 페이지의 글꼴이나 favicon 등 파일들을 가져와야 하는 경우가 많다.

이런 상황에 사용할 수 있는 것이 바로 <script> <link>태그다.

 

사용법은 아주 간단하니 확인해보자.

  <!-- 자바스크립트 가져오기 -->
  <script src="javascript.js"></script>

  <!-- css stylesheet 가져오기 -->
  <link rel="stylesheet" href="style.css">

  <!-- favicon 가져오기 -->
  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

  <!-- 다른 html파일 가져오기 -->
  <link rel="import" href="component.html">

  <!-- apple web icon img 가져오기 -->
  <link rel="apple-touch-icon" href="favicon.png">

위 예시 태그들은 보통 head태그 내 에서 사용된다.

물론 script태그는 랜더링이 끝난 이후 작동할 수 있도록 body태그 맨 마지막에 작성되는 경우도 있다.

 

사용법이 더 설명할 필요가 없을 정도로 간단하다.

script 태그는 src속성 내에 파일주소를 작성하면 된다.

link태그는 href속성 내에 파일주소를 작성하면 된다.