javascript 특징
- 클라이언트 프로그램인 'WebBrower'에서 실행됨
- 모든 webBrowser가 같은 Javascript를 사용하지 않는다.
- 웹문서를 동적으로 바꾸거나 사용자가 입력한 form데이터의 유효성 검사기능을 포함하는 동적인 WebApplication 개발이 가능
- 절차적 프로그래밍과 객체기반 프로그래밍 방법을 모두 지원한다.
(프로토타입기반의 객체기반 프로그래밍 지원) - 가장 법용적으로 지원되는 버전은 1.5버전
- Web의 어플리케이션화가 가능하도록 지원.
ex) 구글 및 마이크로소프트에서는 웹브라우저만으로 '워드,엑셀,파워포인트'같은 어플리케이션이 사용가능하도록 지원함. - 인터프리터 언어로서 브라우저에 내장된 자바스크립트 엔진에 의해서 실행됨.
javascript 선언 방식
1. 태그에 직접 입력하기 (인라인/inline)
<a href="javascript:alert('눌렀네?');">눌러보셈</a>
2. html문서에 포함하기 (내장/internal)
- javascript는 html문서 <head>와 <body> 원하는 곳에 넣을 수 있다.
<head>
<style>
div {
color: red;
}
</style>
<script>
// script 태그 : javascript 영역
alert("안녕하세요");
</script>
</head>
<body>
<div>HTML에 포함1</div> <!-- red -->
<div>HTML에 포함2</div> <!-- red -->
<div>HTML에 포함3</div> <!-- red -->
<script>
// script 태그 : javascript 영역
alert("안녕하세요");
</script>
</body>
2. html외부파일로 불러오기 (external)
- src 속성 : 외부파일의 경로 작성
<script src="./js/util.js"></script>javascript 주석
- 한줄 주석 (단축키 : Ctrl +/)
// javascript 한줄 주석입니다.- 두줄이상의 주석
/*여러줄 주석입니다.
하나
둘
셋*/
javascript 영역에 대한 이해
javascript 작성 위치
js를 작성하는 위치는
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- js 작성위치 1 -->
</head>
<body>
<p>p요소입니다.</p>
<!-- js 작성 위치2 -->
</body>
</html>두군데 모두 자유롭게 작성할 수 있다.
'작성위치 1'에서는 문서가 모두 로딩되지 않았기 때문에 웹페이지를 열었을때 js가 동작하지 않는다.
'작성위치 2'에서는 문서가 모두 로딩되었기 때문에 동작한다.
'작성위치 1'에 코드를 작성하더라도 함수를 사용해 페이지가 모두 로딩된 후 js 코드를 실행 할 수 있다.
//페이지의 모든 요소들이 로딩된 후, 함수 안에 있는 코드가 실행됨
window.onload=function(){/*코드입력*/};
//DOM요소들만 로딩되면 함수 안에 있는 코드가 실행됨.
window.addEventListener("DOMContentLoaded",function(){/*코드입력*/});
'Javascript' 카테고리의 다른 글
| Number (수치형) (0) | 2019.11.04 |
|---|---|
| Boolean type (논리형) (0) | 2019.11.04 |
| 내장객체 (Built-in) (0) | 2019.11.01 |
| 연산자 (0) | 2019.11.01 |
| Javascript 식별자(Identifier)와 데이터형(Data Type) (0) | 2019.11.01 |
