본문 바로가기

JavaScript

Array.includes() 의 대체 if( ['a','b','c'].includes('a') ) { //a를 포함 } --------------------------------- if( ['a','b','c'].indexOf('a') != -1 ) { //a를 포함 } 개발 중 생각없이 Array.includes() 를 사용했다가 IE에서는 아예 지원을 안 해서 리뷰테스트 중 쪽팔린 일이 발생했습니다 ㅠㅠ 테스트를 극한상황인 IE 에서 해보는게 맞는데 IE는 켜기가 싫어요 .. 아무튼 사용한데가 한두군데가 아니어서 일일이 반복문을 써야되나 충격을 받고 있던 도중 Array.indexOf() 가 생각났는데 다행히 이건 IE를 지원해서 선방했씁니다 ( IE9 이상) mdn 검색을 생활화합시다ㅠㅠ
동적 객체 생성 var obj = {}; for( var i = 0; i < 5; i++){ obj[i] : i + "번째"; } =============================== obj = { 0 : "0번째", 1 : "1번째", 2 : "2번째", 3 : "3번째", 4 : "4번째" };
[jQuery] prop()이 change 이벤트를 트리거하지 않을 때 change() 이벤트는 코드로 값이 변경될 때가 아니라 유저 상호작용에 의해 트리거됩니다. 그러므로 아래와 같이 직접 처리해줘야 합니다. $(element).prop('checked',true).change(); 또는 $(element).prop('checked',true).trigger('change');
자바스크립트에서 siblings() 사용하기 get siblings in pure javascript 자바스크립트에서 jQuery 없이는 너무 귀찮았던 형제선택, siblings()를 써 봅시다. HTML 간단한 예를 위한 DIV 3형제입니다. JavaScript ES6 var siblings = t => [...t.parentElement.children].filter(e => e != t); var one = document.getElementById('one'); console.log(siblings(one)); ------------------------------ ▶ (2)[div#two, div#three] 위의 ...는 HTMLCollection을 배열로 만들기 위한 것입니다. Array.from() 등을 사용해도 되겠죠 filter()는 조건을 통과하는 요소를 배열로 반환합니다. 즉 부모노..
FullCalendar 예제/데모 자바스크립트 달력 라이브러리에서 가장 많이 사용된다고 생각하는 FullCalendar의 샘플코드입니다. codepen의 이름모를 출처를 참고했습니다. 급하게 사용하려고 만들다 보니 코드가 더러운데 시간을 핑계로 방치하고 있다가 그래도 공유해놓으면 부끄사하기 싫어서라도 고치지 않을까 싶어 올려봅니다. 클릭/드래그로 일정추가/수정일정 hover시 팝업일정 리사이즈일정 드래그앤드롭카테고리, 작성자로 필터링일정별 색상지정데모를 위해 일정 데이터는 json파일을 사용하고 있습니다.데이터베이스와 함께 사용하실 땐 ajax 부분을 수정하시구요 쿼리 짜실땐 그대로 넣었다 빼기만 하면 되서 편하실 거라 위안해 봅니다... ( 조금씩 수정중 )미리보기https://saintsilver.github.io/FullCalend..
[javascript] 모바일 유저 체크 window.mobilecheck = function() { var check = false; (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207..
구글 스프레드시트 API 활용하기 : INSERT 지난 포스트에 이어 구글 스프레드시트에 동적으로 데이터를 삽입해 보겠습니다. 먼저 스프레드시트 하나를 준비해 주세요. 저는 지난 포스팅에 썼던 시트를 쓰겠습니다. 스크립트 작성, 배포 시트가 준비되셨다면, 메뉴에서 도구-스크립트 편집기로 이동합니다. 그리고 스크립트에 아래 코드를 붙여넣으세요! //var SHEET_NAME = "시트1"; var SCRIPT_PROP = PropertiesService.getScriptProperties(); function doGet(e){ return handleResponse(e); } function doPost(e){ return handleResponse(e); } function handleResponse(e) { var lock = LockService.g..
구글 스프레드시트 API 활용하기 : SELECT 이번 포스팅에서는 갓구글의 스프레드시트 API를 활용해 보겠습니다. 구현하다 보니 한글포스팅은 오래된 것 뿐들이라 고생한 김에.. 최대한 간결하게 써 보려고 합니다. 목표는 웹에서 자바스크립트로 해당 스프레드시트의 내용을 가져오고, 쿼리를 사용해 특정 데이터를 뽑아내는 것입니다. 준비 먼저 구글 스프레드시트에 들어가 새 문서를 만들어 보겠습니다. 이미 갖고 계신 시트를 활용하셔도 괜찮습니다. 공개설정 먼저 링크를 가진 사용자라면 시트데이터에 접근할 수 있도록 변경합니다. 오른쪽 위 공유 - 고급 - 변경 - 사용: 링크가 있는 모든 사용자를 선택한 후 저장합니다. KEY 획득 스프레드시트 URL을 보시면 아래와 같은 형식으로 되어 있습니다. https://docs.google.com/spreadsheet..