스크립트 언어
기본 프로그램의 동작을 사용자의 요구에 맞게 수행되도록 해주는 용도의 언어로, 스크립트 언어는 컴파일이 아닌 인터프리터를 이용하여 소스코드를 한 줄씩 읽어 실행한다. (컴파일에 소요되는 시간은 없으나 대신 프로그램 실행 시간은 느리다.)
JavaScript란?
웹 브라우저에서 많이 사용하는 인터프리터 방식의 OOP언어로 ECMA script 표준을 따르는 대표적 웹 기술.
JavaScript 작성 방법
1. 브라우저 콘솔에 직접 작성
2. 태그에 직접 js코드 작성
3. html 내부에 script 태그를 이용하여 작성(internal)
4. html 외부에 파일(.js)를 이용하여 작성(external)
1. inline 방식
<button type="button" onclick="alert('inline버튼이 클릭되었습니다.')">
inline 방식
</button>
2. internal 방식
<body>
<button type="button" onclick="btnClick1()">internal방식</button>
<button type="button" id = "btn2">internal방식2</button>
<script>
let btnClick1 = () => {
alert("internal버튼이 클릭되었습니다.")
}
//id가 "btn2"인 요소가 클릭되었을 때 기능 수행
document.getElementById("btn2").onclick = function() {
alert("internal 버튼2가 클릭되었습니다.")
}
</script>
</body>
3. external 방식
HTML
<button type="button" onclick="btnClick3()">External방식</button>
<div id = "box"></div>
<button type="button" onclick="changeColor1()">red</button>
<button type="button" onclick="changeColor2()">yellow</button>JS
let btnClick3 = () => alert("External버튼이 클릭되었습니다.")
function changeColor1(){
document.getElementById("box").style.backgroundColor = "red"
}
let changeColor2 = () => {
document.getElementById("box").style.backgroundColor = "yellow"
}
'JS > JavaScript' 카테고리의 다른 글
| 6. 정규표현식 (0) | 2023.02.28 |
|---|---|
| 5. 이벤트 (0) | 2023.02.25 |
| 4. 변수와 자료형 (0) | 2023.02.25 |
| 3. 요소 접근 방법 (1) | 2023.02.24 |
| 2. 입출력 (0) | 2023.02.24 |
