JavaScript (Parameter) function() 함수를 업그레이드 시킬 수 있는 바로 파라미터(parameter)입니다. 함수의 파라미터를 이해를 돕기 위해 "구멍"이라고 이야기를 하겠습니다. 앞서 사용했던 html을 parameter.html로 복사하여서 사용하였습니다. Alert 박스 닫기 버튼 위에 코드를 보시면 Alert 박스를 열고 닫기 위해 자바스크립트 함수를 두 개를 작성하였습니다. 여기에서 파라미터(parameter)를 사용하면 한 줄로 Alert 박스를 열고 닫을 수 있습니다. 파라미터(parameter) 사용하는 방법 1. 함수를 만든다 2. 데이터를 넣어줄 부분에 구멍을 만들어 준다 구멍은 여러개 사용할 수 있으며 콤마로 구별을 지어주면 됩니다. 예) alertOpen(구..

JavaScript (Function) 이번 포스팅에서는 function에 대해서 짧고 굵게 알아보겠습니다. 앞서 Alert에서 사용했던 코드를 활용해보겠습니다. Alert 박스 닫기 버튼 onclick 안에 작성된 코드를 보면 너무 길어 보입니다. 이렇게 긴 코드를 줄이기 위해 사용하는 기능이 function 입니다. function : 긴 코드를 깔끔하게 한 단어로 축약해서 사용하게 해주는 기능입니다. function 문법 function 아무렇게나작명(){ 긴 코드~~~ 긴 코드~~~ } '아무렇게나작명()'만 사용하여서 긴 코드를 불러와서 실행시킬 수 있습니다 그러면 Alert의 열기 버튼을 function을 사용하여 구현해보겠습니다. Alert 박스 닫기 버튼 길었던 코드 document.get..

JavaScript (Alert) 경고창과 같이 화면에 특정 행동을 했을 때 뜨는 창을 자바스크립트로 만들어 보아요~ ※ UI 만드는 법 1. 미리 디자인을 해놓고 숨긴다. 2. 버튼을 누르거나 특정 행동을 할 때 볼 수 있게 구현한다. UI 만드는 방법의 순서대로 Alert 기능을 구현해 보겠습니다. 1. 미리 디자인 하기! ① html 파일 생성 : alert.html (보여지는 디자인) Alert 박스 버튼 : css 파일을 html에 적용시키기 위해 링크로 불러오는 것입니다. href=""부분에 해당 css 파일의 이름과 경로를 작성하면 됩니다. Alert 박스 : Alert로 띄울 박스를 먼저 생성해 줍니다. ② css 파일 생성 : main.css (css로 숨기기) .alert-box { b..

JavaScript - Selector Selector 선택자 ※ selector: 선택장치, 선택자 요소를 제어하기 위해서는 어떠한 요소를 제어할 것인지 선택을 하여 컴퓨터에게 알려주어야 합니다. 컴퓨터에게 명령을 할 때는 자세히, 구체적으로 명령을 해주어야하기 때문에 어떤 요소인지 알려주는 방법이 바로 Selector(선택자)입니다. 선택자를 어떻게 사용할지 함께 연습해보겠습니다. ※ 저는 자바스크립트를 연습할 때 Brackets라는 프로그램을 사용했습니다. ※ 혹은 codepen.io를 사용하셔도 손 쉽게 HTML과 JavaScript를 실행시켜서 보실 수 있습니다. -> https://codepen.io/pen/?template=WNjggVm (codepen.io를 사용하여 Selector를 작성..