본문 바로가기
반응형

FullStack/11. JavaScript8

자바스크립트 이벤트 디버깅 방법 자바스크립트를 통해 UI를 구성하면서 단순 스크립트명만으로 찾기도 어려우며, 분석하기에 난의도가 있습니다. 소스에 "debugger"을 작성하면 분석에 편리하지만, 해당 소스를 찾아서 작성하기란 쉬운 일이 아닙니다. 간단하게 디버깅할 수 있는 방법을 알려드립니다. 1. Element 속성에 이벤트가 명시된 경우 개발자 도구를 이용하여 확인하였을 때 객체에 이벤트(onclick 등) 이벤트가 명시된 경우라면, 해당 부분을 더블클릭으로 html 수정이 가능합니다. "debugger;" 문구를 해당 이벤트 앞에 추가 후, 클릭을 하면 디버그 모드가 실행됩니다. 2. JavaScript 함수 임의 실행 스크립트 함수를 실행하려면 Console 창에 실행하고자 하는 함수 앞에 "debugger;"을 추가하여 함수.. 2023. 3. 8.
팝업창 닫힘 onunload가 아닌 스크립트로 체크하기 팝업창 닫힘 onunload가 아닌 스크립트로 체크하기 PG결제 연동 과정에서 처리 후 지정된 URL로 리턴되도록 처리되어 있었다. 결제 처리 과정에서 취소에 대한 후처리가 필요한데, PG결제 창에서의 취소는 취소 페이지로 이동하도록 되어 있어 처리가 가능하지만, 팝업 창의 닫기(X) 버튼 처리를 하기 위해서 "onunload" 이벤트를 처리하려고 했더니 페이지 이동에도 동일하게 실행되어 사용할 수 없게 되어 버렸다. "onunload" 이벤트 대신 스크립트를 통해 창이 닫혔는지 체크하도록 변경하였다. var pop = window.open('https://www.google.com'); var timer = setInterval(function() { onunload if(pop.closed) { cl.. 2022. 8. 3.
[JS] 날짜 포맷 만들기 JavaScript 사용 중 날짜 포맷을 YYYY-MM-DD로 구할 때 한자리의 월에 "0"을 붙이는 작업에 깔끔한 소스가 생각나지 않았는데 stackoverflow에서 괜찮은 내용이 있었다. var MyDate = new Date(); var MyDateString; // YYYY/MM/DD MyDateString = MyDate.getFullYear() + '/' + ('0' + (MyDate.getMonth()+1)).slice(-2) + '/' + ('0' + MyDate.getDate()).slice(-2) ; alert(MyDateString); slice를 이용하여 slice(-2)를 할 경우 뒤에서 2자리를 가져오는 것이기 때문에 4월일 경우 "04" -> "04", 10월의 경우 "010.. 2021. 4. 20.
내부변수를 이용하여 한번 실행 내부 변수를 이용하여 선언한 함수를 한 번만 실행 function once (fn) { var called = false; return function () { if (!called) { called = true; fn.apply(this, arguments); } } } var fn = once(function(){ console.log('Hello~'); }); fn(); fn(); fn(); 2020. 1. 28.
반응형