자바스크립트란?

HTML과JavaScript의 차이점, 이벤트(Event), 콘솔(Console)

자바스크립트(JavaScript)는 HTML로 만들어진 정적인 웹페이지와 사용자가 상호작용할 수 있도록 만들어진 동적인 언어이자, 프로그래밍 언어

1. HTML과 JavaScript의 차이점

<h1>html</h1>
1+1 <!--1+1-->

HTML은 정적인 언어로 1+1을 그대로 출력

<script>
    document.write('1+1');    //2
</script>

SCRIPT는 동적인 언어로 1+1을 계산하여 2로 출력

2. 이벤트(event)

이벤트란? 웹브라우저 위에서 일어나는 사건으로 사용자와 상호작용이 가능할 수 있게 함

2-1. 이벤트 종류

Event

Description

onclick

클릭했을 때

onchange

상태 변동이 있을 때

onkeydown

키를 눌렀을 때

onkeyup

키를 눌렀다 뗐을 때

2-2. 예시

<input type="button" value="hi" onclick="alert('hi')">
<input type="text" onchange="alert('changed')">
<input type="text" onkeydown="alert('key down!')">

3. 콘솔(console)

콘솔이란 ? 자바스트립트를 실행하는 여러 방법 중 하나로, 파일을 만들지 않고도 즉석에서 코드를 실행시켜 줌

3-1. 사용방법

  • 개발자도구(우클릭-inspect/검사 혹은 F12) ➡ esc 혹은 console 메뉴 클릭

  • 한 번 실행했던 코드를 재실행하려면 키보드의 ⬆를 누르기

//예) 글자 수를 알고 싶을 때
//1. 내용을 따옴표('')로 묶어준다.
//2. 문자의 개수를 알려주는 명령어 length 사용.
//3. 경고창 alert를 사용하여 글자의 개수를 알 수 있다.

alert('내용'.length)
  • 명령어 입력 후 실행 - enter

  • 명령어 입력 후 실행 유보 또는 줄바꿈 - shift + enter

Last updated