Âíåøíèå îáúåêòû
|
Àâòîð: Àðòåìüåâ Ñåðãåé Èãîðåâè÷ ICQ: 438856621 email: _spin_@bk.ru |
Âíåøíèå îáúåêòû âñåãäà äîñòóïíû â ëþáîì ìåñòå ñêðèïòà.  îòëè÷èå îò âñòðîåííûõ îáúåêòîâ ÿçûêà, âíåøíèå îáúåêòû íå íàäî èíèöèàëèçèðîâàòü èëè ñîçäàâàòü èõ ýêçåïëÿðû. Íàáîð âíåøíèõ îáúåêòîâ è èõ ñâîéñòâà ìîãóò îòëè÷àòüñÿ â ðàçíûõ áðàóçåðàõ, ïîýòîìû ìû ðàññìîòðèì òîëüêî îñíîâíûå.
Îáúåêò window
Îáúåêò window ÿâëÿåòñÿ êîðíåâûì â èåðàðõèè âíåøíèõ îáúåêòîâ. window ñîäåðæèò â ñåáå ññûëêè íà òåêóùóþ ñòðàíèöó (îáúåêò document), èñòîðèþ ïåðåìåùåíèé (îáúåêò history), âñå âëîæåííûå ôðåéìû, åñëè òàêîâûå åñòü (îáúåêò frames), è åù¸ íåñêîëüêî îáúåêòîâ, êîòîðûå ìû ðàññìîòðèì íèæå.
Îñíîâíîå íàçíà÷åíèå window - ñîçäàíèå è óïðàâëåíèå îêíîì áðàóçåðà. Ïîä îêíîì â JavaScript ïîíèìàåòñÿ êîíòåéíåð, â êîòîðûé çàãðóæàåòñÿ äîêóìåíò.  çàâèñèìîñòè îò áðàóçåðà îêíî ìîæåò àññîöèèðîâàòüñÿ ñ îòäåëüíûì îêíîì èëè ñ îòäåëüíîé âêëàäêîé â îáùåì îêíå.  òàáëèöå ïðèâåäåíû îñíîâíûå ñâîéñòâà è ìåòîäû îáúåêòà window:
| Ñâîéñòâà | |
| parent | Ññûëêà íà ðîäèòåëüñêîå îêíî. |
| self | Ññûëêà íà ñåáÿ. |
| top | Ññûëêà íà ãëàâíîå îêíî. |
| name | Íàçâàíèå îêíà. |
| closed | Ïðèçíàê òîãî, ÷òî îêíî óæå áûëî çàêðûòî. ×àñòî ïðèìåíÿåòñÿ â òàéìåðàõ äëÿ îïðåäåëåíèÿ äîñòóïíîñòè ýëåìåíòîâ ñòðàíèöû. |
| status | Òåêñò, êîòîðûé îòîáðàæàåòñÿ â ñòàòóñíîé ñòðîêå (ïîëîñêà âíèçó îêíà) |
| returnValue | Çíà÷åíèå, êîòîðîå âîçâðàùàåòñÿ ðîäèòåëüñêîìó îêíó ïðè çàêðûòèè òåêóùåãî. |
| document | Ññûëêà íà îáúåêò document |
| event | Ññûëêà íà îáúåêò event |
| history | Ññûëêà íà îáúåêò history |
| location | Ññûëêà íà îáúåêò location |
| navigator | Ññûëêà íà îáúåêò navigator |
| screen | Ññûëêà íà ãëîáàëüíûé îáúåêò screen |
| Ìåòîäû | |
| open() | Îòêðûâàåò íîâîå îêíî áðàóçåðà. Â çàâèñèìîñòè îò íàñòðîåê è òèïà áðàóçåðà ýòî ìîæåò áûòü íîâàÿ êîïèÿ áðàóçåðà èëè ïðîñòî íîâàÿ "çàêëàäêà" |
| close() | Çàêðûâàåò òåêóùåå îêíî |
| showModalDialog() | Ïîêàçûâàåò ñîçäàâàåìîå îêíî â ìîäàëüíîì ðåæèìå, ò.å. ïîëüçîâàòåëü äîëæåí çàêðûòü åãî, ÷òîáû ïðîäîëæèòü ðàáîòàòü ñ ðîäèòåëüñêèì îêíîì |
| alert() | Âûâîäèò äèàëîã ïðåäóïðåæäåíèÿ. Ìû óæå íåîäíîêðàòíî ïîëüçîâàëèñü ýòèì ìåòîäîì. |
| prompt() | Âûâîäèò äèàëîã ñ ïðîñüáîé ââåñòè êàêîå-ëèáî çíà÷åíèå. |
| confirm() | Âûâîäèò äèàëîã ïîäòâåðæäåíèÿ, â êîòîðîì ïîëüçîâàòåëü ìîæåò âûáðàòü îäíî èç äâóõ äåéñòâèé. |
| navigate() | Ïåðåíàïðàâëÿåò îêíî áðàóçåðà íà äðóãóþ ñòðàíèöó. |
| setInterval() | Ôóíêöèè óïðàâëåíèÿ òàéìåðàìè, ìû óæå ðàññìàòðèâàëè èõ â óðîêå, ïîñâÿù¸ííîì ñîáûòèÿì òàéìåðà. |
| setTimeout() | |
| clearInterval() | |
| clearTimeout() | |
| Ñîáûòèÿ | |
| onblur() | Îêíî ïîòåðÿëî ôîêóñ ââîäà. |
| onfocus() | Îêíî ïîëó÷èëî ôîêóñ ââîäà (ñòàëî àêòèâíûì). |
| onhelp() | Ïîëüçîâàòåëü íàæàë êíîïêó F1 |
| onresize() | Èçìåíèëñÿ ðàçìåð îêíà |
| onscroll() | Ïîëüçîâàòåëü ïðîêðóòèë îêíî |
| onerror() | Âîçíèêëà îøèáêà ïðè ïåðåäà÷å |
| onbeforeunload() | Îêíî áóäåò âûãðóæåíî (çàêðûòî) |
| onunload() | Îêíî çàêðûâàåòñÿ |
| onload() | Îêíî ïîëíîñòüþ çàãðóæåíî. |
Ðàññìîòðèì ïðèìåð èñïîëüçîâàíèÿ îáúåêòà window:
<script type="text/javascript" language="javascript"> var wnd; // ïåðâàÿ ôóíêöèÿ îòêðûòèÿ îêíà function openNew() { // Ñîçäà¸ì íîâîå ïóñòîå îêíî // ðàçìåðîì 300õ300 ïèñêåëåé wnd = window.open('', '', 'width=300, height=300'); // Âïèñûâàåì â ýòî îêíî ñòðîêó wnd.document.open(); wnd.document.write( "<html><head><title>Âñïëûâàþùåå îêíî</title></head> <body>ñàìîçàêðûâàþùååñÿ îêíî</body>"); wnd.document.close(); // Óêàçûâàåì ñòðîêó äëÿ îòîáðàæåíèÿ â ñòàòóñíîé ñòðîêå wnd.status = 'Ñîîáùåíèå â ñòðîêå ñòàòóñà'; // Âçâîäèì òàéìåð íà ïÿòü ñåêóíä window.setTimeout("closeWindow();", 5000); } // ôóíêöèÿ çàêðûòèÿ îêíà function closeWindow() { if(wnd) wnd.close(); } // âòîðàÿ ôóíêöèÿ îòêðûòèÿ îêíà function openFullScreen() { // Ñîçäà¸ì íîâîå ïóñòîå îêíî // â ïîëíîýêðàííîì ðåæèìå áåç ïîëîñ ïðîêðóòêè wnd = window.open('', '', 'fullscreen=yes, scrollbars=no'); // Âïèñûâàåì â ýòî îêíî ñòðîêó wnd.document.open(); wnd.document.write( "<html><head><title>Âñïëûâàþùåå îêíî</title></head> <body>ñàìîçàêðûâàþùååñÿ ïîëíîýêðàííîå îêíî</body>"); wnd.document.close(); // Âçâîäèì òàéìåð íà äåñÿòü ñåêóíä window.setTimeout("closeWindow();", 10000); } function openSized() { window.open(window.location.href); } </script> ... <input type="button" onclick="openNew()" value="Ñîçäàòü ïðîñòîå îêíî" /><br /> <input type="button" onclick="openFullScreen()" value="Íà ïîëíîýêðàííîå îêíî" /><br /> <input type="button" onclick="closeWindow()" value="Çàêðûòü äî÷åðíåå îêíî" /><br /> ...
Ýòîò ñêðèïò â çàâèñèìîñòè îò íàæàòîé êíîïêè îòêðûâàåò ëèáî îêíî ðàçìåðîì 300õ300 ïèêñåëåé, ëèáî îêíî, ðàçâ¸ðíóòîå íà âåñü ýêðàí. Ïîñëå ñîçäàíèÿ îêíà â íåãî çàïèñûâàåòñÿ òåêñòîâàÿ ñòðîêà. Êàê âèäèòå, ïîëüçîâàòüñÿ îáúåêòîì window äîñòàòî÷íî ïðîñòî, ãëàâíîå - íå çëîóïîðòåáëÿòü, ò.ê. ñðåäñòâàìè çàùèòû îò ñïàìà è íàçîéëèâîé ðåêëàìû â áîëüøèíñòâå áðàóçåðîâ ìîë÷à áëîêèðóþò âñïëûâàþùèå îêíà.
Îáúåêò document
Îáúåêò document ïðåäñòàâëÿåò ñîáîé äîêóìåíò (HTML-ñòðàíèöó), çàãðóæåííûé â îêíî.  ïðåäûäóùåì ïðèìåðå ìû óæå èñïîëüçîâàëè ìåòîä write() ýòîãî îáúåêòà äëÿ çàïîëíåíèÿ ïóñòîãî äîêóìåíòà. Âñå îñíîâíûå ìåòîäû è ñâîéñòâà îáúåêòà ïåðå÷èñòåëû â òàáëèöå:
| Ñâîéñòâà | |
| alinkColor | Öâåò àêòèâíîé ññûëêè íà ñòðàíèöå |
| bgColor | Öâåò ôîíà ïî-óìîë÷àíèþ |
| body | Ññûëêà íà ýëåìåíò body |
| cookie | Cookie äàííîé ñòðàíèöû. Èçìåíåíèå ýòîãî ñâîéñòâà ïðèâîäèò ê ñîõðàíåíèþ íîâûõ cookie â áðàóçåðå ïîëüçîâàòåëÿ. |
| fgColor | Öâåò òåêñòà ïî-óìîë÷àíèþ. |
| lastModified | Äàòà ïîñëåäíåãî èçìåíåíèÿ ñòðàíèöû |
| linkColor | Öâåò åù¸ íå ïîñåù¸ííûõ ññûëîê íà ñòðàíèöå |
| location | Òåêóùèé àäðåñ ñòðàíèöû |
| parentWindow | Ññûëêà íà ðîäèòåëüñêîå îêíî |
| referer | Àäðåñ ñòðàíèöû, ñ êîòîðîé ïðèøåë ïîëüçîâàòåëü |
| title | Äîïîëíèòåëüíûé çàãîëîâîê ñòðàíèöû |
| vlinkColor | Öâåò ïîñåù¸ííûõ ññûëîê |
| url | Àäðåñ òåêóùåãî äîêóìåíòà |
| Ìåòîäû | |
| clear() | Î÷èñòêà âûäåëåííîé îáëàñòè äîêóìåíòà |
| close() | Çàêðûòèå äîêóìåíòà, ðàíåå îòêðûòîãî äëÿ èçìåíåíèÿ. |
| open() | Îòêðûòèå äîêóìåíòà äëÿ èçìåíåíèÿ |
| write() | Çàïèñü òåêñòà è HTML-êîäà â óêàçàííîå ìåñòî äîêóìåíòà. |
| Ñîáûòèÿ | |
| onlick() | Êëèê â îáëàñòè äîêóìåíòà |
| ondblclick() | Äâîéíîé êëèê â îáëàñòè äîêóìåíòà |
| onerror() | Îøèáêà ïðè çàãðóçêå äîêóìåíòà |
| onhelp() | Ïîëüçîâàòåëü âûçâàë ñïðàâêó (íàæàë F1) |
| onkeydown() | Ñîáûòèÿ, ïðîèñõîäÿùèå ïðè íàæàòèè êíîïîê èëè ïåðåìåùåíèè óêàçàòåëÿ ìûøè. Ïîäðîáíî ðàññìîòðåíû â óðîêå "Ñîáûòèÿ êëàâèàòóðû è ìûøè" |
| onkeypress() | |
| onkeyup() | |
| onmousedown() | |
| onmousemove() | |
| onmouseout() | |
| onmouseup() | |
Âîò ïðèìåð èñïîëüçîâàíèÿ îáúåêòà document:
<head>
<script type="text/javascript" language="javascript">
var stepLink = 0;
var stepBody = 0;
var timerLink;
var timerBody;
// ôóíêöèÿ ðàñêðàñêè ññûëîê
function colorizeLink()
{
if(stepLink==0)
window.document.linkColor = "#ff0000";
else window.document.linkColor = "#0000ff";
stepLink = (stepLink == 0)? 1:0;
timerLink =
window.setTimeout("colorizeLink();", 1000);
}
//
// ôóíêöèÿ ðàñêðàñêè ôîíà
function colorizeBody()
{
if(stepBody==0)
window.document.bgColor = '#ccff00';
else window.document.bgColor = '#00ffcc';
stepBody = (stepBody == 0)? 1:0;
timerBody =
window.setTimeout("colorizeBody();", 1300);
}
//
// ôóíêöèÿ èíèöèàëèçàöèè
function initTimers()
{
timerLink =
window.setTimeout("colorizeLink();", 1000);
timerBody =
window.setTimeout("colorizeBody();", 1300);
var elm = document.getElementById('lastModified');
if(elm)
elm.innerHTML = document.lastModified;
}
</script>
</head>
<body onload="initTimers()">
<div id="lastModified">Íåèçâåñòíî</div>
<a href="123.htm">ïåðâàÿ ññûëêà</a><br />
<a href="456.htm">âòîðàÿ ññûëêà</a><br />
</body>
 ýòîì ñêðèïòå ïî òàéìåðó ìåíÿåòñÿ öâåò ôîíà è öâåò àêòèâíîé ññûëêè. Åñòåñòâåííî, èñïîëüçîâàòü òàêîé ýôôåêò íà ñâîåé ñòðàíèöå íå ñòîèò, ò.ê. ó ïîñåòèòåëÿ ãëàçà óñòàíóò ðàíüøå, ÷åì îí ïðèñòóïèò ê ÷òåíèþ ñòàòüè èëè ïîñòà. Áîëåå ïðèåìëåìûì ÿâëÿåòñÿ ïðèìåíåíèå ýôôåêòà "äåíü-íî÷ü", ñìûñë êîòîðîãî - èçìåíåíèå ÿðêîñòè èëè öâåòà ôîíà â çàâèñèìîñòè îò âðåìåíè ñóòîê. Ïðèìåð òàêîãî ñêðèïòà âû áåç òðóäà íàéä¸òå â èíòåðíåòå.
Îáúåêò location
Ýòîò îáúåêò ïðåäîñòàâëÿåò ñâîéñòâà è ìåòîäû äëÿ óïðàâëåíèÿ àäðåñîì òåêóùåé ñòðàíèöû.
| Ñâîéñòâà | |
| href | Ïîëíûé àäðåñ ñòðàíèöû |
| hash | Èìÿ "ÿêîðÿ", êîòîðûé óêàçûâàåòñÿ â àäðåñå ïîñëå "#" |
| host | ×àñòü àäðåñà, ñîäåðæàùàÿ èìÿ ñåðâåðà è ïîðò |
| hostname | ×àñòü àäðåñà, ñîäåðæàùàÿ èìÿ ñåðâåðà |
| pathname | ×àñòü àäðåñà, ñîäåðæàùàÿ ïîëíûé ïóòü ê ôàéëó íà ñåðâåðå |
| port | ×àñòü àäðåñà, ñîäåðæàùàÿ ïîðò |
| protocol | ×àñòü àäðåñà, ñîäåðæàùàÿ ïðîòîêîë çàïðîñà ñòðàíèöû |
| search | ×àñòü àäðåñà, ñîäåðæàùàÿ ïîèñêîâûé çàïðîñ (òåêñò, çàïèñàííûé ïîñëå "?") |
| Ìåòîäû | |
| assign() | Î÷èñòêà âûäåëåííîé îáëàñòè äîêóìåíòà |
| reload() | Çàêðûòèå äîêóìåíòà, ðàíåå îòêðûòîãî äëÿ èçìåíåíèÿ. |
| replace() | Îòêðûòèå äîêóìåíòà äëÿ èçìåíåíèÿ |
Åñëè âû îáðàòèëèñü ïî àäðåñó:
http://server.com:8080/catalog/2009/index.htm?id=122#descr
òî çíà÷åíèÿ ñâîéñòâ îáúåêòà location áóäåò ñëåäóþùèìè:
| href | http://server.com:8080/catalog/2009/index.htm?id=122#descr |
| hash | descr |
| host | server.com:8080 |
| hostname | server.com |
| pathname | catalog/2009/index.htm |
| port | 8080 |
| protocol | http: |
| search | id=122 |
Ñ ïîìîùüþ îáúåêòà location ëåãêî îñóùåñòâëÿåòñÿ ïåðåíàïðàâëåíèå ïîëüçîâàòåëÿ íà äðóãóþ ñòðàíèöó èëè, íàîáîðîò, çàïðåò âîçâðàòà íà ïðåäûäóùóþ ñòðàíèöó.
// ïåðåíàïðâëåíèå
document.location.href = 'íîâûé àäðåñ ñòðàíèöû';
// èëè
document.assign('íîâûé àäðåñ')
// çàïðåò âîçâðàòà
document.replace('íîâûé àäðåñ')
Çàïðåò âîçâðàòà ñâîäèòñÿ ê òîìó, ÷òî àäðåñ ñòðàíèöû íå ñîõðàíÿåòñÿ â èñòîðèè áðàóçåðà. ×àùå âñåãî ýòî íåîáõîäèìî, êîãäà îêíî ñëóæèò äëÿ âûáîðà ïàðàìåòðîâ è ñîçäàíî â âèäå äèàëîãà (íàïðèìåð, äèàëîã âûáîðà öâåòà èëè øðèôòà â îíëàéí-ðåäàêòîðå). Òàêèå ñòðàíèöû ñàìè ïî ñåáå áåñïîëåçíû, ò.ê. äîëæíû ñîçäàâàòüñÿ ðîäèòåëüñêèì îêíîì è åìó æå âîçâðàùàòü âûáðàííîå çíà÷åíèå, à çíà÷èò è çàïîìèíàòü èõ â èñòîðèè íåçà÷åì.
Îáúåêò history
Îáúåêò history ïðåäíàçíà÷åí äëÿ ðàáîòû ñ èñòîðèåé áðàóçåðà. Âñå ñòðàíèöû, êîòîðûå âû îòêðûâàåòå â îêíå, ôèêñèðóþòñÿ â îáúåêòå history. Ñ ïîìîùüþ ýòîãî îáúåêòà ìîæíî ëåãêî ïåðåìåùàòüñÿ ïî ñïèñêó ïîñåù¸ííûõ ñòðàíèö è çàãðóæàòü íåîáõîäèìûå. Åäèíñòâåííîå îãðàíè÷åíèå - íåëüçÿ îáðàòèòüñÿ ê èñòîðèè ïîñòîðîííåé ñòðàíèöû, ò.å. âñÿ èñòîðèÿ ñòèðàåòñÿ êàê òîëüêî âû çàêðûëè îêíî.
History èìååò âñåãî îäíî ñâîéñòâî - length, îïðåäåëÿþùåå êîëè÷åñòâî ïîñåù¸ííûõ ñòðàíèö. Ïðè ïåðåõîäàì ïî èñòîðèè íåîáõîäèìî ñëåäèòü, ÷òîáû èíäåêñ çàïðàøèâàåìîãî ýëåìåíòà íå âûõîäèë çà ïðåäåëû äëèíû ñïèñêà.
Äëÿ ïåðåìåùåíèÿ ïî ñïèñêó ïðåäíàçíà÷åíû ìåòîäû îáúåêòà history, èõ âñåãî òðè:
| back() | Çàãðóçêà ïðåäûäóùåãî ýëåìåíòà èñòîðèè |
| forward() | Çàãðóçêà ñëåäóþùåãî ýëåìåíòà èñòîðèè |
| go(èíäåêñ) | Çàãðóçêà ýëåìåíòà èñòîðèè ñ óêàçàííûì èíäåêñîì. |
Î÷åâèäíî, ÷òî ìåòäî back() ýêâèâàëåíòåí âûçîâó go(-1), à ìåòîä forward() - âûçîâó go(1). Âîò ïðèìåð èñïîëüçîâàíèÿ îáúåêòà history:
// ïåðåõîäî ê ýëåìåíòó ñ èíäåêñîì 4 if(window.history.length > 3) window.history.go(4);
// ïåðåõîä ïî êëèêó íà ññûëêå <a href="" onclick="javascript:window.history.back();"> Âåðíóòüñÿ </a>
Îáúåêò navigator
Ýòîò îáúåêò ñîäåðæèò èíôîðìàöèþ î ïàðàìåòðàõ áðàóçåðà, òàêèõ êàê: ïðîèçâîäèòåëü, âåðñèÿ, ïîääåðæêà cookie è äðóãèõ.
| Ñâîéñòâà | |
| appCodeName | Êîäîâîå èìÿ áðàóçåðà. Îïðåäåëÿåò ãðóïïó áðàóçåðîâ èëè ò.í. "äâèæîê". |
| appName | Îáû÷íîå íàçâàíèå áðàóçåðà, íàïðèìåð "Netscape Navigator" |
| appVersion | Âåðñèÿ áðàóçåðà, íàïðèìåð "6.0" |
| cookieEnabled | Ïðèçíàê òîãî, ÷òî áðàóçåð ïîääåðæèâàåò cookie. Ëîãè÷åñêîå çíà÷åíèå (äà/íåò). |
| userAgent | Ñòðîêà, êîòîðóþ âûñûëàåò áðàóçåð ñåðâåðó ïðè çàïðîñå ñòðàíèöû. Ñòðîêà ñîäåðæèò äàííûå î òèïå áðàóçåðà, åãî âåðñèè è ïîääåðæèâàåìûõ ðàñøèðåíèÿõ.. |
| Ìåòîäû | |
| javaEnabled() | Ìåòîä îïðåäåëÿåò âîçìîæíîñòü çàïóñêà Java-ñêðèïòîâ, ëîãè÷åñêîå çíà÷åíèå. |
Âîò òàêèì ñêðèïòîì ìîæíî áûñòðî îïðåäåëèòü ïàðàìåòðû ñîáñòâåííîãî áðàóçåðà:
<script type="text/javascript" language="javascript"> alert(
'Êîäîâîå èìÿ: ' + window.navigator.appCodeName + '\n' +
'Íàçâàíèå áðàóçåðà: ' + window.navigator.appName + '\n' +
'Âåðñèÿ: ' + window.navigator.appVersion + '\n' +
'Ïîääåðæêà cookie: ' + window.navigator.cookieEnabled + '\n' +
'Ñòðîêà àãåíòà: ' + window.navigator.userAgent
);
</script>
Îáúåêò navigator â îñíîâíîì èñïîëüçóåòñÿ ïðè íàïèñàíèè êðîññáðàóçåðíûõ ñêðèïòîâ, ò.ê. ïîçâîëÿåò îïðåäåëèòü êàêèå áëîêè êîäà â êàêîì áðàóçåðå èñïîëíÿòü. Ê ñîæàëåíèþ, èñïîëüçîâàíèå îáúåêòà navigator íå äà¸ò ñòîïðîöåíòðîé ãàðàíòèè ïðè îïðåäåëåíèè òèïà áðàóçåðà. Câÿçàíî ýòî ñ òåì, ÷òî ëþáîé áðàóçåð (êðîìå, íàâåðíîå, IE) ïîçâîëÿåò ëåãêî èçìåíèòü ñòðîêè User-Agent íà ÷òî óãîäíî, â òîì ÷èñëå íà ïîäïèñü áðàóçåðà äðóãîãî òèïà.
Ïîýòîìó áîëåå òî÷íûì áóäåò îïðåäåëåíèå òèïà áðàóçåðà ïî íàëè÷èþ èëè îòñóòñòâèþ îáúåêòîâ, ñïåöèôè÷íûõ äëÿ êîíêðåòíîé ïëàòôîðìû. Î êðîññáðàóçåðíîñòè íàïèñàíî óæå íåìàëî êíèã è ñòàòåé, ïîýòîìû ìû íå áóäåò ãëóáîêî âäàâàòüñÿ â ýòó òåìó.
Îáúåêò event
Îáúåêò event ñîäåðæèò îïèñàíèå ïîñëåäíåãî ïðîèçîøåäøåãî ñîáûòèÿ. Ñòðóêòóðó è ñïîñîáû ïðèìåíåíèÿ ýòîãî îáúåêòà ìû ïîäðîáíî ðàññìàòðèâàëè â óðîêå "Ñîáûòèÿ êëàâèàòóðû è ìûøè".
Îáúåêò screen
Screen ÿâëÿåòñÿ ãëîáàëüíûì îáúåêòîì, îäèíàêîâûì äëÿ âñåõ ñêðèïòîâ è âñåõ îêîí áðàóçåðà. Îí îïèñûâàåò âîçìîæíîñòè èñïîëüçóåìîãî óñòðîéñòâà îòîáðàæåíèÿ, íàïðèìåð, ìîíèòîðà. Îáúåêò ñîäåðæèò íåñêîëüêî ñâîéñòâ, íàèáîëåå èíòåðåñíûìè èç êîòîðûõ ÿâëÿåòñÿ width è height, îïðåäåëÿþùèå øèðèíó è âûñîòó ýêðàíà â ïèêñåëÿõ.
<script type="text/javascript" language="javascript">
var goodW = (window.screen.width >= 800 &&
window.screen.width < 2048)
var goodH = (window.screen.height >= 600 &&
window.screen.height < 1024)
if(goodW && goodH)
alert('Ïîäõîäÿùåå ðàçðåøåíèå');
else
alert('Íå ïîäõîäÿùåå ðàçðåøåíèå!');
</script>
Ñêðèïò îïðåäåëÿåò òåêóùåå ðàçðåøåíèå ýêðàíà è åñëè îíî ñëèøêîì ìàëåíüêîå èëè ñëèøêîì áîëüøîå - âûäà¸ò ïðåäóïðåæäåíèå. Íà ïðàêòèêå âìåñòî âûâîäà ñîîáùåíèÿ ëó÷øå ïðîâåñòè êîððåêòèðîâêó ïàðàìåòðîâ îòîáðàæåíèÿ ñòðàíèöû ñ ó÷¸òîì íåñòàíäàðòíîãî ðàñøèðåíèÿ. Íàïðèìåð, äëÿ î÷åíü ìàëåíüêèõ ðàñøèðåíèé ìîæíî ñêðûòü íåèíôîðìàòèâíûå ýëåìåíòû (êàðòèíêè, ðåêëàìó è ïð.), ÷òîáû îíè íå çàãðîìîæäàëè è áåç òîãî íåáîëüøîé ýêðàí.
Èòàê, ìû ðàññìîòðåëè îñíîâíûå îáúåêòû, èñïîëüçóåìûå ïðè ðàçðàáîòêå áîëüøèíñòâà ñêðèïòîâ, õîòÿ â äåéñòâèòåëüíîñòè îáúåêòîâ çíà÷èòåëüíî áîëüøå (ìû íå ðàññìàòðèâàëè îáúåêòû, ñïåöèôè÷íûå äëÿ êîíêðåòíûõ áðàóçåðîâ). Ñëîæíîñòè ó âàñ ìîãóò âîçíèêíóòü òîëüêî ïðè íàïèñàíèè êðîññáðàóçåðíûõ ñêðèïòîâ, íî ýòî óæå äåëî îïûòà è ãëóáèíû çíàíèÿ îñîáåííîñåé áðàóçåðîâ, äëÿ êîòîðûõ ñîçäà¸òñÿ ñêðèïò.
 íîâûõ ñïåöèôèêàöèÿõ JavaScript (âåðñèè 1.2, 1.3+) â ñòàíäàðòíûå îáúåêòû äîáàâëåíî ìíîãî èíòåðåñíûõ è ïîëåçíûõ ñâîéñòâ è ìåòîäîâ. Íåêîòîðûå èç íèõ óæå ïîääåðæèâàþòñÿ áîëüøèíñòâîì ïðîèçâîäèòåëåé áðàóçåðîâ, íî äàëåêî íå âñå, ïîýòîìó èñïîëüçîâàòü íîâîââåäåíèÿ íàäî îñìîòðèòåëüíî è àêêóðàòíî.
