PROGRAMMING

PROGRAMMING/Web

06 Local Storage

1 Local Storage 웹 스토리지의 한 종류로 웹페이지의 세션이 끝나더라도 데이터가 지워지지 않음 여러 탭이나 창 간에 데이터가 서로 공유되며 탭이나 창을 닫아도 데이터는 브라우저에 그대로 남아 있음 다른 브라우저 간에는 스토리지가 호환되지 않음 JavaScript를 이용하거나 브라우저 캐시또는 로컬 저장 데이터를 지워야만 사라짐 // 키에 데이터 쓰기 localStorage.setItem("key", value); // 키로 부터 데이터 읽기 localStorage.getItem("key"); // 키의 데이터 삭제 localStorage.removeItem("key"); // 모든 키의 데이터 삭제 localStorage.clear(); // 저장된 키/값 쌍의 개수 localStorage.l..

PROGRAMMING/Web

05 Event

1 addEventListener EventTarget 인터페이스의 메서드로 지정한 유형의 이벤트를 대상이 수신할 때 마다 호출할 함수를 설정함 등록: DOM객체. addEventListener(이벤트명, 실행할 함수명, 옵션); 삭제: DOM객체. removeEventListener(이벤트명, 실행했던 함수명); 대상 이벤트를 지원하는 모든 객체 Element, Document, Widow + XMLHttpRequest type: 수신할 이벤트 유형을 나타내는 문자열 listerner: 지정한 이벤트를 수신할 객체 options: 이벤트 수신기의 특징을 지정할 수 있는 객체 useCapture: 이벤트 타겟으로 이벤트가 전달되기 전 이 수신기가 먼저 발동되어야 함을 나타내는 불리언 값 _ 기본값을 fa..

PROGRAMMING/Web

04 Dom

1 DOM 1) DOM이란? 문서 객체 모델(The Document Object Model) HTML, XML 문서의 프로그래밍 인터페이스 문서 구조, 스타일, 내용 등을 변경할 수 있게 도움 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할 2) DOM과 JavaScript 코드는 자바스크립트로 작성되었지만 문서(document) 와 문서의 요소(element) 에 접근하기 위해 DOM 이 사용 DOM 이 없다면 자바스크립트 언어는 웹 페이지 또는 XML 페이지 및 요소들과 관련된 모델이나 개념들에 대한 정보를 갖지 못하게 됨 자바스크립트와 DOM 가 밀접하게 연결되어 있었지만, 나중에는 각각 분리되어 발전됨 페이지 콘텐츠(the page content)는 DOM 에 저..

PROGRAMMING/Web

03 JavaScript

1 JavaScript 객체 기반의 스크립트 프로그래밍 언어 동적, 타입을 명시할 필요 없는 인터프린터 언어 객체지향형 프로그래밍과 함수형 프로그래밍 모두 표현 가능 웹 브라우저 내에서 주로 사용하며 다른 응용프로그램의 내장 객체에도 접근할 수 있는 기능을 가짐 Node.js와 같은 런타임 환경과 같이 서버 프로그래밍에도 사용됨 1) ES6 ECMAScript: 크로스 브라우징 이슈를 해결하기 위한 javascript 표준화 /* 템플릿 리터럴 */ var name = "현진"; var age = 25; console.log(`저의 이름은 ${name}이고, 나이는 ${age}살 입니다.`); /* 화살표 함수 */ var str = arg1 => console.log(arg1); /* This */ f..

yuujoeng
'PROGRAMMING' 카테고리의 글 목록 (7 Page)