유튜브 코딩애플 자바스크립트 4강

2023. 1. 12. 14:34JAVASCRIPT

파라미터를 사용해

function 하나를 작성하여 다양하게 활용 가능

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="name.css">
</head>
<body>

    <div class="alert-box" id="alert">
        <p id="alarm">Alert 박스</p>
    </div>

    <button onclick="알림창('아이디를 입력해주세요')">아이디</button>
    <button onclick="알림창('비밀번호를 입력해주세요')">비밀번호</button>

    <script>

        function 알림창(a) {
            document.getElementById('alarm').innerHTML = a;
            document.getElementById('alert').style.display = 'block';
        }

    </script>

</body>
</html>

function기능 하나로 두가지 기능을 구현할 수 있다.

 

자연스럽게 닫고 열리는 기능이 추가되지 않아 다음에 닫고 열리는 기능을 구현해보려 한다.