Front-End/JavaScript

JS 소스코드 작성방법

깡돌 2017. 3. 7. 23:46

<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width,initial-scale=1">

<meta http-equiv="x-ua-compatible" content="IE=edge">

<title>template</title>

<link href="../../_common/css/style.css" rel="stylesheet" type="text/css">

</head>

<body>

<header>

<div class="header-contents">

<h1>제목</h1>

<h2>부제목</h2>

</div><!-- /.header-contents -->

</header>

<div class="main-wrapper">

<section>


</section>

</div><!-- /.main-wrapper -->

<footer>JavaScript Samples</footer>

<script>

console.log('많이 먹는 손님이다');

</script>

</body>

</html>


다이렉트 작성방법


<!doctype html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width,initial-scale=1">

<meta http-equiv="x-ua-compatible" content="IE=edge">

<title>2-02_tag</title>

<link href="../../_common/css/style.css" rel="stylesheet" type="text/css">

</head>

<body>

<header>

<div class="header-contents">

<h1>자바스크립트는 어디에 작성하나?</h1>

<h2>자바스크립트 파일 읽기</h2>

</div><!-- /.header-contents -->

</header>

<div class="main-wrapper">

<section>

<p>브라우저의 콘솔을 열어주세요.</p>

</section>

</div><!-- /.main-wrapper -->

<footer>JavaScript Samples</footer>

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

<script>

console.log('많이 먹는 손님이다');

</script>

</body>

</html>


script.js        // 파일

// 외부 자바스크립트 파일

/*

외부 자바스크립트 파일은

읽은 후 바로 실행된다

*/ 

console.log('옆 손님은');


<scritp src="HTML 파일 위치를 기준으로 한 경로"></scritp>


외부파일 작성방법


HTML5