-
자바스크립트(JavaScript) 들어가기프로그래밍/JavaScript 2022. 9. 22. 19:28728x90
자바 스크립트는 모질라 재단의 프로토타입 기반의 프로그래밍 언어로, 스크립트 언어에 해당된다.
HTML은 웹 문서의 내용을 구성하고, CSS는 웹 문서의 레이아웃이나 색상, 스타일 등을 지정한다. 자바스크립트를 추가하면 웹 문서의 각 요소를 가져와 필요에 따라 스타일을 변경하거나 움직이게 할 수 있다.
웹 문서를 자동차에 비유하자면, HTML은 자동차의 뼈대, CSS는 자동차의 외관, JavaScript는 자동차의 동력이라고 볼 수 있다.
객체 기반의 스크립트 프로그래밍 언어로 웹 브라우저 내에서 주로 사용되며, 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있으며, 웹 문서에는 자바스크립트 소스를 읽고 처리하는 해석기 기능이 존재한다.
자바스크립트 소스는 웹 문서에서 <script> 태그를 이용해 자바 스크립트 소스가 짧은 경우 웹 문서에서 자바 스크립트를 실행할 위치에 바로 작성할 수 있다.
자바스크립트 출력
HTML 문서에 출력
- document.write() 함수를 통해 출력개발자 도구(F12키) console에 출력
- console.log() 함수를 통해 출력자바스크립트 주석
- 한줄 주석 : //
- 여러줄 주석 : /* … */<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>자바스크립트의 출력</title> </head> <body> <h2>자바스크립트의 출력</h2> <script> /* 날짜 : 2021-12-27 작성자 : 윤OO 비고 : 자바스크립트의 출력 */ document.write('<p>안녕하세요. 자바스크립트입니다.</p>'); // body에 출력 console.log('안녕하세요. Javascript!'); // console에 출력 </script> </body> </html>
콘솔에 출력한 결과값을 확인하는 방법은 F12키를 누르고 console 칸에서 확인이 가능하다.
외부 스크립트
자바 스크립트도 CSS 처럼 link를 통해 외부 스크립트를 연결할 수 있다.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>외부 자바스크립트</title> <script src="./js/script.js"></script> <!--외부 링트 연결--> </head> <body> <h2>외부 자바스크립트</h2> </body> </html>
console.log('외부에 연결된 스크립트입니다. 모두 화이팅 해봐요')
728x90'프로그래밍 > JavaScript' 카테고리의 다른 글
JavaScript 조건문 (0) 2022.09.27 JavaScript 타입변환과 연산자 (1) 2022.09.26 JavaScript 데이터 타입 (0) 2022.09.25 JavaScript 변수, 상수 (0) 2022.09.25 JavaScript 대화상자 (0) 2022.09.24