IT 성장일기
[Javascript] HTML 문서에 Javascript 삽입하기 본문
반응형
HTML 문서에 Javascript 삽입하기
HTML 문서에는 여러 가지 태그를 사용할 수 있는데 <script> 태그도 그중 하나입니다.
<script> 태그를 이용해 HTML 문서에 자바스크립트 소스를 삽입하고자 할 때 크게 두 가지 방법을 사용할 수 있습니다.
1. 본문에 <script> 태그 사용하기.
<HTML>
<head>
<script>
//
<script>
</head>
<body>
<label>자바스크립트 소스<label>
<script>
alert('hello world');
</script>
</body>
<script>
//
</script>
</HTML><script> 태그는 HTML 문서 내부 대부분의 위치에 적용할 수 있습니다.
과거에는 <script type="text/javascript">와 같이 스크립트의 타입을 명시적으로 기입하곤 했지만
지금은 javascript가 브라우저의 유일한 스크립트 언어로 사용되고 있기 때문에 굳이 기입할 필요는 없습니다.
2. 외부 스크립트 파일 불러오기
<script src=".../.../myscript.js"></script>이렇게 스크립트 태그 내부에 src 속성으로 파일 경로를 입력하면 외부 스크립트 파일을 HTML 문서에 추가할 수 있습니다.
외부 스크립트를 가져오는 경우는 크게 두가지로 나눌 수 있습니다.
- 스크립트의 길이가 너무 길어 HTML 문서에 삽입하면 코드의 길이가 너무 길어지는 경우
- 여러 HTML 문서에서 공용으로 사용하게 될 스크립트인 경우
여러 개의 스크립트를 불러오고 싶다면 <script> 태그를 여러 개 삽입하면 됩니다.
<script src=".../.../myscript1.js"></script>
<script src=".../.../myscript2.js"></script>
도움이 되어드렸다면 구독 / 좋아요 부탁드립니다.👏🏻
감사합니다.🙂
반응형
'Script > Javascript' 카테고리의 다른 글
| [Javascript] 디스트럭처링 문법(Destructuring Assignment) 파헤치기 (0) | 2024.08.13 |
|---|---|
| [Javascript] 숫자 단위에 맞춰 쉼표, 서수 표현, 단위 이니셜 추가하기 (0) | 2023.10.12 |
| [Javascript] Javascript에서 반복문 사용하기 (0) | 2023.10.12 |
| [Javascript] Javascript에서 데이터 형식 변환하기 (0) | 2023.10.12 |
| [Javascript] 실시간으로 두 개의 input 요소의 값 비교해서 이벤트 발생시키기 (0) | 2023.10.12 |
'Script/Javascript' Related Articles
more
