Programování v jazyce JavaScript Katedra softwarového inženýrství Fakulta informačních technologií České vysoké učení technické v Praze Pavel Štěpán, 2011 Skriptovani browseru BI-JSC Evropský sociální fond Praha & EU: Investujeme do vaší budoucnosti P. Štěpán PHP BI-PHP, výpis 10 1/5
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8"> </head> <body> <h1>skriptovani browseru</h1> <script type="text/javascript"> // Object window - instance prohlizece (okna) // mozno skriptovat i frames // standardni (systemova) dialogova okna alert, confirm, prompt // var volba = confirm("stiskni tlacitko"); // true/false /* if (volba) alert("stisknuto OK"); else alert("stisknuto Cancel"); */ // var jmeno = prompt("jmeno:","franta Novak"); // 2. param - default // if (jmeno!= null && jmeno!= "") // nestiskl Cancel, vyplnil // alert("jmenujete se: " + jmeno); // Zobrazeni noveho okna (zalozky). Muze byut zakazano // v udalostni procedure volam otevreni okna, aby nebylo blokovano // udalostni procedury obvykle definovany v head!! function zobrazokno(){ window.open("http://www.centrum.cz"); // _blank - nove okno, _self - aktualni,... Popr. nazev okna function zobrazokno2(){ // pro otevirane okno lze nastavit ruzne parametry: // ulozim-li pointer na nove okno, mohu jej pres nej ovladat var newwin = window.open("http://www.centrum.cz","_blank", "toolbar=yes,location=yes,directories=no,status=no," + "menubar=yes, scrollbars=yes, resizable=yes," + "copyhistory=yes, width=400,height=400"); // newwin.close(); // if (!newwin.closed)...; // okno otevreno? P. Štěpán PHP BI-PHP, výpis 10 2/5
// pozice okna (Firefox = screenx) - osetreni i pro Firefox var left = (typeof window.screenleft == "number")? window.screenleft:window.screenx; var top = (typeof window.screentop == "number")? window.screentop:window.screeny; // alert("left: "+left + "; Top:"+top); // posun okna - muze byt zakazan!! // window.moveto(200,300); // pozice v pixels // window.moveby(deltax,deltay); // relativni posun // rozmery vnitrku okna var sirka = window.pagewidth; var vyska = window.pageheight; // osetreni vcetne IE (ve standardnim i nestandardnim rezimu) if (typeof sirka!= "number"){ // kompatibilni rezim? if (document.compatmode == "CSS1Compat"){ sirka = document.documentelement.clientwidth; vyska = document.documentelement.clientheight; // quirks mode? else { sirka = document.body.clientwidth; vyska = document.body.clientheight; // alert("vyska: " + vyska + "; Sirka: " + sirka); // zmena rozmeru okna - muze byt zakazana // window.resizeto(400, 600); // relativne - prirustky (i zaporne) // window.resizeby(xdelta, ydelta); // Objekt screen // availheight, availwidth - rozmery obrazovky bez status baru, // toolbaru, menu,... (nekdy) // colordepth - pocet bitu pro barvu // alert(screen.height+";"+screen.width+";"+screen.colordepth); // alert(screen.availwidth+";"+";"+screen.availwidth+";"+ // screen.colordepth); // Casovace function poprodleve(){ alert("kuk!"); // var id = settimeout(poprodleve,3000); // prodleva v msec // cleartimeout(id); // zruseni P. Štěpán PHP BI-PHP, výpis 10 3/5
/* opakovany timeout setinterval a clerinterval; prilis se nepouziva - spise se pouzije settimeout a ve vyvolavana funkci settimeout interval znovu nastavi. Potom se nemuze stat, ze novy interval zacne pred ukoncenim minule cinnosti */ // Objekt history - navigacni historie daneho okna // alert("delka historie: " + history.length); // history.back(); // o stranku zpet // history.go(-2); // podobne // Object location - prace s adresou stranky // alert("pokracovat"); // location.assign("http://www.centrum.cz"); // podobne: // window.location = "http://www.centrum.cz"; // location.href = "http://www.centrum.cz"; // prace s castmi adresy: // alert(location.protocol); // podobne dalsi casti adresy (nektere lze i menit): //.hash - cast za znakem #,.search (cast za znakem? - parametry) //.hostname,.pathname,.port,.protocol // metoda replace - jako assign, ale neulozi adresu do historie // (nejde se vratit) // metoda reload - znovu zavede stranku; bez parametru - muze // nacist z cache; parametr true - nacte ze servera // Objekt navigator - informace o browseru // nepresne, nejednotne, falsujici!! var txt; txt = "CodeName: " + navigator.appcodename + "\n" + "Name: " + navigator.appname + "\n" + "Version: " + navigator.appversion + "\n" + "Cookies Enabled: " + navigator.cookieenabled + "\n" + "Platform: " + navigator.platform + "\n" + "User-agent header: " + navigator.useragent + "\n"; // alert(txt); P. Štěpán PHP BI-PHP, výpis 10 4/5
// Obvykle vhodnejsi detekce schopnosti (capability detection) // nedetekovat konkretni verzi, nepouzivat nejednoznacne udaje // Priklad: nalzeni elementu dle ID v ruznych browserech: function getelement(id){ if (document.getelementbyid(id)) // nejcastejsi return document.getelementbyid(id) else if (document.all) // pro starsi IE kolekce vsech elementu return document.all[id]; else throw new Error("Nelze ziskat element!"); // detekce podivnosti (quirks) - co nefunguje spravne. Priklad: // chyba IE - neprekryje vlastnost s atributem [[DontEnum]] var chybnedontenum = function(){ var o = {tostring:function(){ ; for (var p in o){ if (p == "tostring") return false; // spravne chovani return true; (); alert(chybnedontenum); </script> <!-- pro jednoduchost - nedoporucovany zpusob prirazeni udalosti --> <input type="button" value="zobraz okno" onclick="zobrazokno()"> <input type="button" value="zobraz okno s parametry" onclick="zobrazokno2()"> </body> </html> P. Štěpán PHP BI-PHP, výpis 10 5/5