본문 바로가기
반응형

전체 글39

윈도우 폴더 안에 "파일 리스트" 추출하기 1. 폴더를 열어준다. ​2. 폴더 주소창에 cmd 라고 입력 후 Enter 키를 눌러준다. (윈도우 터미널 실행) ​3. 실행된 윈도우 터미널에서 dir/b>_list.txt 명령어를 입력 후 Enter 키를 눌러주면, _list.txt 파일이 생성되고 해당 파일을 열어보면 파일 리스트가 생성 되어있음을 확인할 수 있다.(※ 파일 경로까지 표시된 리스트를 만들고 싶으면 dir/b/s>_list.txt 명령어를 입력하면 된다.) 2024. 5. 1.
자바스크립트 IndexedDB 코드 IndexedDB는 서버가 아닌 클라이언트 측(웹 브라우저)에 데이터를 저장할 수 있는 기술이다. 많은 양의 데이터를 영구적으로 저장 할 수 있으며, 비동기식으로 key - value 객체(Object) 형태로 데이터를 저장하게 된다.(※ 참고: IndexedDB의 용량 제한은 하드디스크(HDD)의 50% 이다.)# 데이터베이스(DB) 생성# 객체 저장소(Object Store) 생성 (여러개의 객체 저장소 생성 가능)let DB;let DB_VERSION = 1; // 데이터베이스 버전.let DB_NAME = 'INDEXED_DB'; // 데이터베이스 이름.let OBJECT_STORE_NAME = 'OBJECT_STORE'; // 객체 저장소 이름.// 데이터베이스 생성.let CREATE_DB.. 2024. 4. 29.
자바스크립트 "모바일 스와이프" 기능 코드 let swipeWidth = 75; //스와이프 간격 설정let touchstartX = 0;let touchDeltaX = 0;document.addEventListener('touchstart', function(e){ touchstartX = e.targetTouches[0].pageX; document.addEventListener('touchmove', function(e){ touchDeltaX = e.targetTouches[0].pageX - touchstartX; });})document.addEventListener('touchend', function(){ if(Math.abs(touchDeltaX)>=swipeWidth){ if(.. 2024. 4. 29.
HTML 데이터 속성(data-)에서 JSON 사용하기 HTML 데이터 속성(data-)에서 JSON을 사용하려면 아래와 같은 코드를 사용하면 된다. ※ 주의할 점은 HTML 데이터 속성(data-)값의 바깥 영역을 작은 따옴표( ' )로 감싸고, JSON 데이터의 key값과 value값을 큰 따옴표( " )로 감싸 주어야 한다. 그리고 JSON 데이터의 마지막에는 콤마/쉼표( , )를 찍지 않는다. 꼭 아래와 같은 JSON 코드 형식에 맞게 작성해 주어야만 에러 없이 자바스크립트에서 JSON 파싱이 가능하다. 2024. 4. 29.
자바스크립트 MutationObserver MutationObserver API는 DOM 요소의 "속성", "텍스트", "자식 노드"가 변경 되었는지를 감시하는 API 이다.​[MutationObserver 옵션]subtree: 대상(target) 노드만 관찰 할건지.. 하위 모든 자식 요소들도 관찰할건지 여부 (true, false)childList: 자식 노드가 변경 및 추가, 제거 되었는지 관찰 여부 (true, false)​characterData: 텍스트 노드가 변경되었는지 관찰 여부 (true, false)characterDataOldValue: 텍스트가 변경되기 이전의 값을 가져올건지 여부 (true, false)​attributes: 속성값이 변경 되었는지 관찰 여부 (true, false)attributeFilter: 특정 속성만.. 2024. 4. 29.
자바스크립트 localStorage 로컬스토리지(localStorage)는 웹 브라우저에 데이터값을 반영구적으로 저장할수 있는 기능이다. 웹브라우저가 종료 되어도 데이터값이 그데로 유지가 되며 최대 5MB까지 저장 가능하다. [데이터 저장]localStorage.key값 = "value값";localStorage["key값"] = "value값";localStorage.setItem("key값", "value값"); [데이터 불러오기]let value = localStorage.key값;let value = localStorage["key값"];let value = localStorage.getItem("key값"); [데이터 삭제]localStorage.removeItem("key값"); [모든 데이터 삭제]localStorage.cle.. 2024. 4. 29.
자바스크립트 setInterval, clearInterval setInterval 함수는 설정된 시간마다 계속 반복 되는 함수이다. let interval = setInterval(function(){ // 실행 코드 작성 (1000 == 1초 마다 실행) }, 1000); setInterval 함수 실행를 중단 하려면 clearInterval를 실행하면 된다.clearInterval(interval); 2024. 4. 29.
자바스크립트 setTimeout, clearTimeout setTimeout 함수는 설정된 시간이 경과되면 단 한번만 실행 되는 함수이다.let setTime = setTimeout(function(){ //실행 코드 작성 (3000 == 3초 뒤에 실행)}, 3000); setTimeout 함수 실행을 (중간에) 취소하려면 clearTimeout 을 실행하면 된다.clearTimeout(setTime);[jQuery 코드]$(document).delay(3000).queue(function(next){ //실행 코드 작성 (3000 == 3초 뒤에 실행) next(); }); 2024. 4. 29.
자바스크립트 matchMedia matchMedia는 "CSS 미디어쿼리"와 마찬가지로 웹 브라우저의 특정 화면 크기를 감지할 수 있는 코드 입니다. let mediaQuery = window.matchMedia("(max-width: 720px)");mediaQuery.addListener(mediaQueryAction);mediaQueryAction(mediaQuery);function mediaQueryAction(mq){ if(mq.matches){ //720px 이하 }else{ //720px 이상 }} 2024. 4. 29.
반응형