HTML 입문 | HTML 확장 | HTML 자바스크립트(JavaScript)

Tags:

자바스크립트란?

자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어이다.
HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현할 수 있다.
자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 사이드 프로그래밍에서도 사용할 수 있다.
컴퓨터나 스마트폰 등에 포함된 대부분의 웹 브라우저에는 자바스크립트 인터프리터가 내장되어 있다.

script 요소

script 요소는 해당 웹 페이지에 사용할 스크립트(script)를 정의하기 위해 사용한다.
script 요소 내부에 직접 스크립트를 작성하거나, 외부 스크립트 파일의 주소를 src 속성값으로 명시하면 된다.

<script>
    document.getElementById("text").innerHTML = "이것이 자바스크립트다!";
</script>

코드 실행

JavaScript로 HTML 스타일도 변경할 수 있다.

document.getElementById("text").style.fontSize = "25px";
document.getElementById("text").style.color = "red";
document.getElementById("text").style.backgroundColor = "yellow";

코드 실행

noscript 요소

noscript 요소는 스크립트를 지원하지 않는 웹 브라우저를 사용하는 사용자에게 보여줄 문자열을 설정할 때 사용한다. noscript 요소는 일반적인 HTML 문서의 body 요소 내부에 나올 수 있는 모든 요소를 포함할 수 있다.

<script>
    document.getElementById("text").innerHTML = "이것이 자바스크립트다.";
</script>
...
<noscript>이 웹 브라우저는 자바스크립트를 지원하지 않습니다!</noscript>

코드 실행

외부 JavaScript

외부 JavaScript를 이용한 방법은 HTML과 JavaScript를 분리하여 관리할수 있게 해준다.
자바 스크립트를 적용할 모든 웹 페이지의 <head> 태그 내에 <script>태그를 사용하여 자바스크립트를 포함하면 된다.
최근에는 웹 페이지 로딩 문제로 body에 맨 아래에 넣는 경우도 있다.

<script type="text/javascript" src="/external_javascipt.js"></script>

참조




최종 수정 : 2021-08-27