오뚝이개발자

[JS]HTML과 JS의 만남 : script 태그 본문

Front-end/JS

[JS]HTML과 JS의 만남 : script 태그

땅어 2020. 8. 30. 22:03
728x90
300x250

 

본 글은 유튜버 생활코딩님의 WEB2 JavaScript 강의를 듣고 정리한 것이다. 

HTML에게 특정 부분이 JS 코드라는 것을 어떻게 알려줄까? 바로 script 태그를 사용하는 것이다. 이를 사용하면 HTML에게 script 태그 안의 내용은  JS코드로 인식을 하게 도와준다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>JavaScript</h1>
    <script>
        document.write(1+1)
    </script>
    <h1>HTML</h1>
    1+1
</body>
</html>

위 코드에서 script 태그 안의 document.write(1+1)은 JS 코드로, 그 아래의 1+1은 HTML 코드로 인식된다. 그럼 이 코드가 화면에는 어떻게 출력될까?(document.write는 화면에 무언가를 wirte할 때 사용하는 JS코드이다.)

위와 같이 JS 코드로 입력한 것은 2라는 결과값을, HTML 코드로 입력한 것은 그대로 1+1을 출력하는 것을 알 수 있다. 이처럼 JS는 HTML과 달리 그대로 표현하는 것이 아니라 계산 기능도 갖고 있다.

728x90
300x250

'Front-end > JS' 카테고리의 다른 글

[JS] 변수와 대입 연산자  (0) 2020.08.31
[JS] 데이터타입 - 문자열과 숫자  (0) 2020.08.31
[JS] HTML과 JS의 만남 (콘솔)  (0) 2020.08.31
[JS]HTML과 JS의 만남 : 이벤트  (0) 2020.08.30
[JS]자바스크립트(JavaScript)란?  (0) 2020.08.30
Comments