1-01.자바스크립트 작성 위치
2023. 3. 28. 10:28ㆍJavascript/자바스크립트 제대로 배워볼래?
Snippet을 만드는 방법을 배웠는데 이는 아래의 링크에서 참고하도록 하자.
Visual Studio Code에서 코드조각(Snippets)을 슬기롭게 사용하는 방법
Visual Studio Code (이하 VS code) 자체만으로도 매우 훌륭한 툴이지만 코드 조각(Snippets)을 잘 활용한다면 더 쉽고 빠르게 코딩을 할 수 있어요. 코드 조각(Snippets)이라고 하면 핸드폰의 단축키처럼 특
ux.stories.pe.kr
다음과 같이 head안에, body안에, js파일을 별도로 만들어서 src로 불러와서 script를 표현할 수 있다.
1-01.자바스크립트 작성 위치.html
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
<script>
document.write("자바스크립트 head에 위치<br>");
</script>
<script src="script/1-01.자바스크립트 작성 위치.js"></script>
</head>
<body>
<script src="script/1-01.자바스크립트 작성 위치.js"></script>
<script>
document.write("자바스크립트 body에 위치");
</script>
</body>
</html>
script/1-01.자바스크립트 작성 위치.js
document.write("자바스크립트 js에 위치<br>");
HTML은 위에서부터 순서대로 읽어들인다.
그런데 head안에 script를 많이 두다보면,
사용자 입장에서는 html태그들을 먼저 보기에 화면이 늦게 렌더링된다고 느껴질 수 있다.
그래서 script구문들은 html 하단에 위치하는 경우가 많다.
특별한 경우가 아니라면, script구문은 html 하단에 위치시키면 된다!
'Javascript > 자바스크립트 제대로 배워볼래?' 카테고리의 다른 글
| 1-07.연산자 - 산술, 비교, Logical (0) | 2023.03.28 |
|---|---|
| 1-05.데이터 타입 (1) | 2023.03.28 |
| 1-04.변수 선언자 (var, let, const) (0) | 2023.03.28 |
| 1-03.주석(Comments) 처리 (0) | 2023.03.28 |
| 1-02.콘솔(Console) (0) | 2023.03.28 |