1-3강 : function + 간단한 버그 찾기

오늘 배울 거: function 문법

+ 언제 function이 등장해야 하는지

 

 

Q. function 문법을 쓰는 이유?

긴 코드를 깔끔하게 한 단어로 축약 가능

 

function 축약된이름( ){축약할 긴 코드}

 

	<script>

        document.getElementById('alert').innerHTML='???';
        // 위치가 중요! 변경할 html 요소는 위에, js 조작은 밑에서


        // 긴 코드 축약
        function alertOpen(){
            document.getElementById('alert').style.display='block';
        } 

    </script>

 

 

초보 때 겪는 흔한 버그

 

위치가 중요함!!

 

변경할  HTML이 있으면 그 하단에 JS 코딩해야 함

<- HTML을 먼저 읽어야 JS로 조작 가능하기에

 

---

-오늘의 숙제-

닫기 버튼에 적은 코드 짧게 function 축약해보기

 

    <script>

        // 긴 코드 축약=function

        //alertbox 열기 function
        function alertOpen(){
            document.getElementById('alert').style.display='block';
        } 

        //alertbox 닫기 function
        function alertClose(){
            document.getElementById('alert').style.display="none";
        }

    </script>

 

function 축약 전과 똑같이 동작한다!