function

송현민·2025년 1월 8일
js실전

1. 사용예시

함수 사용 전

<body>
     <div id="alertBox">알림창</div>
     <button onclick="document.getElementById('alertBox').style.display = 'block'">보이기</button>
</body>

함수 사용 후

<body>
     <div id="alertBox">알림창</div>
     <button onclick="showAlert()">보이기</button>
</body>
<script>
    function showAlert() {
    document.getElementById('alertBox').style.display = 'block';
}
</script>

2. 파라미터를 활용

파라미터 활용 전

<script>
    function showAlert() {
    document.getElementById('alertBox').style.display = 'block';
}
    function noshowAlert() {
    document.getElementById('alertBox').style.display = 'none';
}
</script>

파라미터 활용 후

<body>
     <div id="alertBox">알림창</div>
     <button onclick="Alert('block')">보이기</button>
     <button onclick="Alert('none')">닫기</button>
</body>
<script>
    function Alert(input) {
    document.getElementById('alertBox').style.display = input;
}
</script>
profile
송현민
이전 포스트

동적 UI 만들기

다음 포스트

이벤트리스너

0개의 댓글