웹표준,웹접근성(html, html5, css, css3, javascript, jQuery, jQueryMobile, snecha, senchaTouch, php, mobileWebApp)

window 객체의 onload 이벤트 window 객체의 onload 속성을 사용하는 것으로 on으로 시작하는 속성을 이벤트 속성이라고 부르고 함수를 할당해야 한다. onload 이벤트 선언window.onload = function(){ // 내용 }위 코드는 window 객체 로드가 완료되면 그때 자동으로 함수를 실행시켜 안에 내용대로 작업을 수행한다. window 객체로드가 완료되는 시기는 html 의 모든 태그가 화면에 올라가는 순간이다. 웹브라우져는 위에서 부터 아래로 태그를 차례대로 실행하고 화면에 출력 하는데 스크립트가 먼저 작성되고 태그가 나중에 작성된 경우, 또는 기타 환경에 따라 생각했던 결과와 다르게 나타날 수 있다. ex1) head 안에 스크립트를 넣은경우 window.onloa..

navigator 객체 웹페이지를 실행하고 있는 브라우저에 대한 정보를 가지고 있는 객체. navigator 객체의 속성 속성 설명 appCodeName 브라우저의 코드명 appName 브라우저의 이름 appVersion 브라우저의 버전 platform 사용 중인 운영체제의 시스템 환경 userAgent 브라우저의 전체적인 정보 ex) navigator 속성 출력var print = ''; // 변수선언for(var key in navigator){ // 포인 반복문 print += key + ':' + navigator[key] + '\n'; // 프린트 변수에 navigator 객체의 키와 키값을 대입연산하고 줄바꿈}console.log(print); // 화면에 출력

location 객체 브라우져의 주소 표시줄과 관련된 객체페이지 이동할때 주로 사용 location 객체의 속성 메서드 설명예 href 문서의 URL 주소 host 호스트 이름과 포트 번호 localhost:30763 hostname 호스트 이름 localhost port 포트번호 30763 pathname 디렉토리 경로 /home/sample.html hash 앵커 이름(#~) #beta search 요청 매개 변수 ?param=10 protocol 프로토콜 종류 http: location 객체의 메서드 속성 설명 assign(link) 현재 위치를 이동 reload() 새로고침 replace(link) 현재위치를 이동 페이지 이동assign() 메서드와 replace() 메서드 모두 페이지를 이동하는..

screen 객체웹브라우져의 화면이 아닌 운영체제 화면의 속성을 가지는 객체screen 객체의 속성 메서드설명 width 화면의 넓이 height 화면의 높이 availWidth 실제 화면에서 사용 가능한 넓이 availHeight 실제 화면에서 사용 가능한 높이 colorDepth 사용가능한 색상 수 pixelDepth 한 픽셀당 비트 수 ex) 브라우져 크기를 화면에 맞추기// pop 변수 선언var pop = window.open('','', 'width=300, height=300');var w = screen.width; // w 변수에 스크린의 넓이 값을 담는다.var h =screen.height; // h 변수에 스크린의 높이 값을 담는다.pop.moveTo(0,0); // 위치를 절대적으..

window 객체 기본 메서드 window 객체의 기본 메서드 메서드설명 moveBy(x,y) 윈도우 위치를 상대적으로 이동 moveTo(x,y) 윈도우 위치를 절대적으로 이동 resizeBy(x,y) 윈도우 크기를 상대적으로 지정 resizeTo(x,y) 윈도우 크기를 절대적으로 지정 scrollBy(x,y) 윈도우 스크롤 위치를 상대적으로 이동 scrollTo(x,y) 윈도우 스크롤 위치를 절대적으로 이동 focus() 윈도우에 초점을 맞춤 blur() 윈도우에 초점을 제거 close() 윈도우를 닫는다ooBy() 형태는 윈도우를 기준으로 상대적으로 속성을 변화 시키고 ooTo() 형태의 메서드는 절대적 기준으로 속성을 변화 시킨다. ex) moveBy() 와 moveTo() 차이 // 변수pop 에..

window 객체 타이머 메서드특정시간에 특정 함수를 실행하게 하는 메서드, setTimeout() 메서드는 특정 시간후 함수를 한번실행하고 setInterval() 함수는 특정시간마다 함수를 실행한다. window 객체의 타이머 메서드 메서드설명 setTimeout(function, millisecond) 일정 시간 후에 함수를 한번 실행 setInterval(function, millisecond) 일정 시간마다 함수를 반복해서 실행 clearTimeout(id) 일정 시간 후에 함수를 한번 실행하는 것을 중단 clearInterval(id) 일정 시간마다 함수를 반복하는 것을 중단 ex1) setTimeout()setTimeout(function(){ // 2초뒤에 한번 실행console.log('..

새 window 객체생성window 객체는 새로운 window 창을 생성 할 수 있다. window 객체의 윈도우 생성메서드 메서드 설명 open(URL, name, features, replace) 새로운 window 객체를 생성 open() 메서드는 네 개의 매개변수를 갖는다.입력해도 되고 입력하지 않아도 되는 매개변수를 옵션이라고 하는데, open() 메서드의 모든 매개변수는 옵션이다. ex1)window.open() // 새창열기 ex2) open() 메서드의 옵션window.open('http://www.naver.com', 'child', 'width=600, height=300', true);코드를 실행하면 위 이미지 처럼 네이버 창이 새창으로 뜬다. open() 메서드의 첫번째 매개 변수는..

window 객체브라우져 기반 자바스크립트의 최상위 객체 ex) window 객체의 속성과 메서드 출력var output = ''; // 변수 선언for(var key in window){// output 변수에 속성을 대입연산output += key + ';' + window[key] + '\n'; }console.log(output); // 출력위와 같이 무수히 많은 속성과 메서드를 가지고 있다.