Javascript (9)
-
Javascript 클립보드 복사Javascript 2022. 12. 16. 10:48
javascript 에 내장되어있는 기본 함수를 사용해서 화면의 값을 클립보드로 복사할 수 있다. 클립보드 복사는 writeText 함수를 사용하는것이 권장되나, 해당 함수는 https, localhost 에서만 동작한다. 개발서버 등 http 포트를 사용하는 경우 구버전인 execCommand 를 사용해줘야 한다. 테스트 할때 textarea element 를 하나 숨겨두고 값을 사용하려고 하였으나 제대로 동작하지 않았다. 원인을모르겠음 하여 구글링한 소스로 사용함. $(".btn-copy").bind('click', function() { var targetItem = $(this).siblings('.item-copy') , targetVal = targetItem.val(); // 숫자만복사할 아..
-
Javascript 모듈화 해서 사용하기Javascript 2021. 1. 8. 12:01
common.js 등의 파일로 공통함수를 작성 할 때, 가독성을 높이기 위해 객체를 모듈화 하여 사용하는 기본 템플릿. Class 처럼 생성자로 초기화 하여 사용하기 commonUtil.js // 생성자 const CommonUtil = function(obj) { for(let key in obj) { this[key] = obj[key]; } this.init(obj); }; // 공통변수 CommonUtil.prototype = { commonData : {}, userInfo: null, PAGING_SIZE: 10 }; CommonUtil.prototype.init = function(obj) { // TODO //this.submit(); }; CommonUtil.prototype.submit..
-
sessionStorage & localStorage 사용Javascript 2020. 12. 29. 15:35
쿠키와 두 가지 스토리지 비교 Cookie Session Stograge Local Storage 만료 기간 별도 지정 현재 탭 유지 시 무제한 용량 4KB 무제한 HTTP 요청 포함 미포함 참고 : https://developer.mozilla.org/ko/docs/Web/API/Window/sessionStorage Window.sessionStorage - Web API | MDN sessionStorage 읽기 전용 속성은 현재 출처 세션의 Storage 객체에 접근합니다. sessionStorage는 localStorage와 비슷하지만, localStorage의 데이터는 만료되지 않고, sessionStorage의 데이터는 페이지 세션이 끝날 developer.mozilla.org [ 사용 예 ..
-
JQuery cookie 라이브러리 활용하기Javascript 2020. 8. 5. 14:15
애플리케이션에서 자주 사용하는 브라우저 쿠키의 옵션들을 다양하게 활용하게 해주는 jquery 의 cookie 라이브러리. document.cookie 로 저장된 쿠키들을 불러올 수 있지만, url 파라미터처럼 name1=value&name2=value2 와 같이 한덩어리의 문자열로 값을 리턴해주기 때문에 일일히 파싱해서 값을 읽어들이기는 쉽지않다. 공통함수에 직접 선언하는것도 어렵진 않지만 옵션 지정까지 고려하면 무료의 훌륭한 라이브러리를 사용하지 않을 이유가 없다! 사실 쿠키 라이브러리는 설명이 따로 필요 없을 만큼 사용법이 간단하지만, 기본 CRUD 정도만 정리해보고자 한다. 참고 ) https://github.com/carhartl/jquery-cookie carhartl/jquery-cookie ..
-
window.console 확장Javascript 2020. 4. 29. 15:59
웹 개발을 하면서 로그 사용은 필수적이지만, 개발에서 찍어주던 로그를 지우지 않고 배포했을 때는 보안에 취약할 수 있다. 이를 방지하기 위하여 console 을 재정의하여 로컬PC, 개발 서버일 때만 로그를 표시하도록 확장하면 편리하다. window.console = (function (originConsole) { if (!window.console || !originConsole) { originConsole = {}; } var isDebug = false; return { log: function (args) { isDebug && originConsole.log && originConsole.log.apply(originConsole, args); }, warn: function (args) {..