[JavaScript] 기초

Javascript

-웹 페이지를 동적으로, 프로그래밍적으로 제어하기 위해서 고안된 객체 기반의 스크립트 언어

ECMAscript

-브라우저에서 동작하는 언어를 만들 때, 문법적인 사항들을 정리한 문서

기초 실습

<!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>Document</title>
</head>
<body id="bodyTag">
    <a href="#">안녕하세요!</a>
    <br><br>
    <button id="btn1">Design Change! 💖</button>
    <button id="btn2">Revert 🌟</button>
    <br>

    <ul>
        <li>HTML</li>
        <li>CSS</li>
        <li>Javascript</li>
    </ul>

    <h1>오늘은 5/11</h1>
    <p>즐거운 JS 수업입니다! 🎊</p>


    <script>
        //자바스크립트의 영역!
        document.getElementById('btn1').addEventListener('click', function(){
            //btn1 클릭했을때 실행할 로직
            // console.log('클릭!')

            //1.배경색 검
            document.getElementById('bodyTag').style.background='black'
            //2. 글자색 흰색
            document.getElementById('bodyTag').style.color='white'

            
        })
        document.getElementById('btn2').addEventListener('click', function(){
        document.getElementById('bodyTag').style.background='white'
        document.getElementById('bodyTag').style.color='black'
        })
    </script>
</body>
</html>

JavaScript의 출력

document.write();

-HTML문서 내에 출력

console.log();

-console창에 출력

alert();

-알림 팝업창으로 출력

JavaScript의 입력

Prompt("출력내용","입력내용")입력창을 통한 입력문

- 리턴타입: String

confirm("출력문 작성")

- 리턴타입 : boolean

티스토리툴바