뚝딱햄 탈출기

[JavaScript] 자바스크립트 사용(연동) 방법 본문

Programming language/JavaScript

[JavaScript] 자바스크립트 사용(연동) 방법

hyrmzz1 2023. 8. 7. 17:25

Javascript 사용법 (HTML과 연동하는 방법)

별도의 JS 파일 생성

html 파일에서 <body> 태그 맨 아래에 작성.

<script> 태그 안에 속성값으로 js 파일을 입력하여 html 파일과 js 파일을 연동한다.

<body>
	<script src = "app.js"></script>
</body>

HTML 내부에 작성

HTML의 <head> tag 내부에 <script> ~ </script> tag 생성하고, script tag 내부에 작성.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    /* 여기에 css code 작성 */
    </style>
    <script>
    // 여기에 js code 작성
    </script>
</head>
<body>
    
</body>
</html>

JS는 웹사이트의 콘솔창에서 확인할 수 있다.

HTML 파일에서 CSS와 JS 모두를 가져온다.
=> css 는 <head>에서 link:css 입력해서 가져오기. // <link rel="stylesheet" href="style.css">의 단축어
=> javascript는 <body> 맨 아래에서 <script src="app.js"></script> 작성.

저작자표시 비영리 변경금지

'Programming language > JavaScript' 카테고리의 다른 글

[JavaScript] 템플릿 리터럴 : 문자열 내에 변수 삽입, 백틱(`)  (0) 2023.08.08
[JavaScript] 산술 연산자, 비교 연산자 : 몫과 나머지, '==='와 '=='의 차이  (0) 2023.08.07
[JavaScript] 프로퍼티와 메서드 : split(), join(), 배열 값 앞 뒤에 추가, 수학 연산 메서드 Math, 문자열 숫자로 변환  (0) 2023.08.07
[JavaScript] 자료형 (데이터 타입, data type)  (0) 2023.08.07
[JavaScript] 자바스크립트 변수 : const, let, var  (0) 2023.08.07
'Programming language/JavaScript' Related Articles more
Comments