728x90

JavaScript

1. <script> 태그는 HTML 문서 어디에든 사용할 수 있다.
2. <script> 태그는 한 문서 안에서 여러 개를 사용해도 된다.
3. <script> 태그가 삽입된 위치에서 소스가 실행된다.		 

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>글자색 바꾸기</title>
    <link rel="stylesheet" href="css/cheng.css">
</head>
<body>
    <h1 id="heading">JavaScript</h1>
    <p id="text">위 텍스트를 클릭해 보세요</p>

    <script>
        var heading = document.querySelector('#heading');
        heading.onclick = function(){
            heading.style.color = "red";
        }
    </script>
</body>
</html>

 

클릭했을 때

 

<script> 태그는 HTML 문서 어느 곳에 있어도 상관없다.

하지만 보통 <script> 태그는 주로 HTML 문서 내용이 끝나는 </body> 태그 앞에 삽입한다.

 

실무에서는 Javascript 소스를 따로 작성하여 HTML 문서에 연결하는 것을 '외부 스크립트 파일을 연결한다.' 라고 말한다.

작업이 필요한 이유는 규모가 큰 프로젝트를 진행할 때는 자바스크립트 소스를 분리하는 것이 효율적이다.

 

 <script src="Test.js"></script>

 

html 파일과 js 파일을 따로 만들어 준 후, html 안에 소스 작성하면 끝이다.

 

html코드
js코드

 

 

728x90
저작자표시 (새창열림)

'Frontend > JavaScript' 카테고리의 다른 글

[JavaScript] 자바스크립트 기초 문법  (0) 2024.07.25
[JavaScript] JavaScript 란 ?  (0) 2024.07.24

티스토리툴바