2023. 6. 20. 22:43ㆍFront/JS
우리가 매일 접속하는 웹사이트는 크게 3가지 요소로 구성된다.
‘HTML(Hyper Text Markup Language)’, ‘CSS(Cascading Style Sheets)’, ‘자바스크립트(Javascript)’다.
HTML은 웹페이지의 큰 뼈대를 제공하고, CSS는 색깔이나 글씨체와 같은 디자인 요소를 관리한다.
자바스크립트는 크로스 플랫폼(cross platform), 객체지향 스크립트 언어로 웹페이지의 동작을 담당한다.
1. JavaScript란
- HTML 문서 내에 동적 요소를 담당
DOM, Event 등을 활용하여 정적인 HTML 문서를 동적으로 운영할 수 있게 해줌
- HTML, CSS 생성, 수정, 삭제
- js 코드는 문장 끝에 세미콜론(;) 사용
- 인터프리터 언어 (Interpreter)
- 서버에서 실행되는 프로그램이 아니라 클라이언트의 브라우저에서 실행되는 Client Side Script 프로그램
2. js 적용방법
1) 내부 자바스크립트 코드
- 내부 스크립트 코드
<head>태그 또는 <body>태그 사이에 <script>태그 작성
head에 넣나 body에 넣나 동작상의 차이는 없음
<script type="text/javascript"> js 코드 작성 </script>
- inline 방식
이벤트를 직접 html 태그에 작성해서 사용, 간단한 코드
<input type ="button" value="클릭" onclick="alert('hi')")>
2) 외부 자바스크립트 사용
- <head>태그 내에 외부 자바스크립트 파일 가져오는 코드 작성
- <script type="text/javascript" src="js파일경로"> js 코드 작성 금지 </script>
- 주로 사용되는 방식