뮁이의 개발새발

[WebStorage API : LocalStorage] - 사용자 로컬에 데이터를 보존 - javascript로 조작 가능 - 모바일에서도 사용 가능 [Cookie와의 차이점] - 영구적 이용 가능 - 5MB까지 사용 가능 - 언제든지 사용 가능 (쿠키는 서버 접속시 사용가능) [기본 구성] - key+value - 도메인과 브라우저 별로 저장 - 값은 문자열로 저장 [data 추가 방법 3가지] //localStorage 데이터 추가 방법 3가지 localStorage.Test = "Sample"; localStorage["Test"] = "Sample"; localStorage.setItem("Test", "Sample"); [data 가져오는 방법 3가지] //LocalStorage 데이터 취득 ..

[Event] - 웹 페이지에서의 여러가지 동작 (상호작용) - ex: 마우스 클릭, 키보드 클릭 ... [마우스 이벤트] - onclick : 마우스로 클릭 - ondblclick: 더블클릭 - onmouseup: 마우스 버튼을 올렸을 때 - onmousedown: 마우스 버튼을 눌렀을 때 [키보드 이벤트] - onkeypress: 키보드가 눌려 졌을때 (눌렀다가 떼면 발생) - onkeydown: 키보드를 누르는 순간 발생 - onkeyup: 키보드의 누르고 있던 키를 뗄 때 발생 [Frame(UI) 이벤트] - onload: 모든 frame이 로딩 되었을 때 - onabort: 로딩하는 중 취소하여 중단 되었을 때 - onselect: 텍스트를 선택 했을때 [폼(form) 이벤트] - form이 전..

[DOM이란!?] - Document Object Model - HTML과 XML문서의 구조를 정의하는 API를 제공 [문서 객체 만들기] - createElement(tagName) : element node 생성 - createTextNode(text): text node 생성 - appendChild(node): 객체에 node를 child로 추가. window.onload = function () { // 변수를 선언하고 element node와 text node 생성. var title = document.createElement('h2'); var msg = document.createTextNode('Hello SSAFY !!!'); // text node를 element node에 추가. ..

[window] - javascript의 최상위 전역객체 - 브라우저와 관련된 여러 객체와 속성, 함수 모두 포함. - BOM(Browser Object Model)으로 불리기도 함. [alert, confirm, prompt] - alert(): 브라우저의 알림 창. - confirm(): 브라우저의 확인/취소 선택창 - prompt(): 브라우저의 입력 창. [navigator] - 브라우저의 정보(플랫폼, 버전 등등..)가 내장된 객체 - HTML5에서는 위치 정보를 알려주는 역할도 가능 [location, history] - location.href: 값을 할당하지 않으면 현재 url을 조회하고 값을 할당하면 할당 된 url 페이지로 이동 - location.reload(): 현재 페이지 새로고침..

var val = 10; var val = 20; // 가능 (재선언, 재할당 O) let val = 10; let val = 20; // 불가능 (재선언 X) let val = 10; val = 20; // 가능 (재할당 O) const val = 10; val = 20; // 불가능 (재선언, 재할당 X) - 프로토타입 기반의 스크립트 프로그래밍 언어 - 객체지향 지원 -html과 함께 실행 -대부분 ECMAScript 표준을 지원 - 웹 브라우저에서 동작하는 유일한 프로그래밍 언어 - 개발자가 별도로 컴파일 작업을 수행하지 않음 [선언 방법] 태그를 사용. html 문서에 포함할 시: function hello(message) { var x = 10; alert("Hello " + message);..

[non-semantic] - div, span - content에 대해 어떤 설명도 하지 않음 [semantic] - form, table, img - content의 의미를 명확히 설명 - html5를 지원하지 못하는 경우, pdf, flash 같은 콘텐츠를 포함할때 사용 웹 브라우저에서 직접 재생할 수 없는 콘텐츠를 포함할 때 사용 오디오나 비디오 재생시 사용

[구성] 선택자+선언으로 구성 .css { margin: 30px; color: black } .css: 선택자 margin:30px => 선언 속성 값 [주석] /* 내용 */ [link] 위와 같은 방식으로 html에서 불러와서 사용 [import] @import를 사용하여 외부 스타일 시트를 적용할 수 있음 @import는 스타일 시트 중 최상단에 위치해야 함! [내부 스타일 시트] tag 내부에 작성. 외부 스타일 시트보다 우선 적용. *인라인 스타일 시트: 개별 element마다 스타일을 지정. 유지보수에 용이하지 않다. *스타일 적용 우선순위 : 인라인>내부>외부 [선택자] 일반 선택자: 전체(*), 타입(h1), 클래스(.class), ID(#idname) * 우선순위 : 전체 화면에 표시X..

도형이 더 많은 것을 비교하는 부분에서 조건문을 전부 다쓰면 코드가 길어진다..!! 간략하게 작성하자. import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.util.StringTokenizer; public class bj14696 { public static void main(String[] args) throws NumberFormatException, IOException { BufferedReader in = new BufferedReader(new InputStreamReader(System.in)); int N = Integer.parseInt(in.readL..