웹 페이지에서 자바스크립트(JavaScript)를 사용하여 할 수 있는
또 다른 재미있는 방법은 시간을 조정하는 것입니다
하지만 먼저
여러분이 알아야 할 것이 있어요
모든 웹페이지에서 사용할 수 있는
window 변수입니다
여기에
console.log(window)를 입력하고 잠깐 기다릴게요
dev tools 확인해보세요
그 안에 무엇이 들어있는지 보세요
보이시나요? 거대해요 많은 것을 포함하고 있습니다
굉장하네요
다른 굉장한 방법을 말해줄게요
제가 가장 좋아하는 방법들 중 몇 가지들입니다.
여러분이 해볼 수 있습니다
window.location은 페이지의 URL에 대한
많은 정보를 담고 있어요
한번 해봅시다
써보도록 하겠습니다
멈출 필요가 없어요
textContent += "The URL of this page
is " + window.location
이것은 객체이니까 접근할 수 있어야 하니
.href를 써주면 됩니다
실제로 iFramed 웹페이지의
URL입니다
또 다른 방법으로 window.navigator.userAgent를 써줄게요
사용자를 탐색에 관련된 것입니다
"The user agent is" +
window.navigator.userAgent: 자 됐어요
userAgent 는 다소 이상하게 여기실 수 있어요
사람이 읽을 수 있다는 걸
의미하는 것이 아닙니다
여러 이유들과 맞지도 않고요
그래서 많은 웹 개발자들이
코드들이 무엇을 의미하는지, 무엇을 작업하고 있는지를
이해하기 위해 libraries를 사용합니다
운영체제도 마찬가지입니다
어렵죠 그래서 어렵지 않은 방법으로
window.outerWidth 와 window.outerHeight가 있어요
해보도록 하죠 "This web page is" +
window.outerWidth + " by " + window.outerHeight
사실은 1280 x 715 사이즈이지만
여러분에게 화면에 보이는 것은
제가 말한 사이즈와는
다를 겁니다
이제 여러분에게 조금 놀라온 것을 보여줄게요
코드의 windonw 부분을
삭제해 보겠습니다
여전히 동작하는 것을 보실 수 있어요
이것은 웹 페이지 상에 있는
디폴트 전역 변수 때문입니다
여러분이 사용하고자하는 변수를 브라우저가 탐색할 때
window 객체에서 찾게 됩니다
그리고 여러분이 전역변수를 만들 때
window 객체는 전역변수를 값으로
저장하고 있습니다
이것은 여러분이 별도로
outerWidth와 outerHeight같은 변수들을 선언하지 않아도 된다는 뜻이 됩니다
window에 이미 window.outerWidth와 window.outHeight가
저장되어 있어요
일반적으로 전역변수들을 함께 모아놓는 것은 피해야 합니다
전역번수들과 기존의 window에 있는 변수들이
서로 충돌할 수 있기 때문입니다
좀 더 안전하게 하려면
전역변수 앞에 접두어를 붙일 수 있어요
칸 아카데미의 경우, 우리가 만들고자 하는 어떠한 전역변수 앞에
KA_를 씁니다
좋아요 이것이 window 객체입니다
이제 동작시키기 위해 두 개의 기능을 어떻게
사용하는지 살펴보도록 합시다