Szkolenia informatyczne: biuro, technologie internetowe, egzaminy technik
CENA - OFERTA: Jesteś zainteresowany/na kursem – zapraszam do kontaktu ze mną, szczegóły: www.poswojsku.pl .
JavaScript Środowisko BOM obiektowy model przegladarki szkolenie bezpłatne
JAVASCRIPT OBIEKTOWY JĘZYK PROGRAMOWANIA
II część szkolenia z JavaScript:
JavaScript Środowisko BOM obiektowy model przegladarki szkolenie bezpłatne
Witam serdecznie w szkoleniu: JavaScript obiektowy język programowania
JavaScript Środowisko BOM obiektowy model przegladarki szkolenie bezpłatne
JavaScript jest językiem, który musi działać w określonym środowisku, zwykle tym środowiskiem dla JavaScript jest przeglądarka internetowa. Oczywiście przeglądarka nie jest jedynym środowiskiem JavaScript. Może nim być np. technologia node.js. Ale o tym opowiem nieco później.
Filozofia działania JavaScript w internecie opiera się na dwóch modelach:
BOM (Browser Object Model) - dla JavaScript
Model Obiektowy Przeglądarki – obsługuje zachowania urządzeń zewnętrznych do przeglądarki oraz obiektu nadrzędnego dla przeglądarkowej JavaScript, czyli obiektu window.
DOM (Document Object Model) – Model Obiektowy Dokumentu - dla JavaScript
DOM to standard zarządzany i rozwijany przez organizację World Wide Web Consortium (W3C). Ma kilka poziomów (0-3), które w różnym stopniu są zaimplementowane przez przeglądarki.
W tej części szkolenia o JavaScript znajdziesz informacje o BOM, w kolejnej – o DOM.
BOM Browser Object Model – Model Obiektowy Przeglądarki – najważniejsze elementy
Window - obiekt globalny JavaScript, wszystkie wbudowane funkcje JavaScript są metodamiobiektu window.
Pora na szczegóły - JavaScript obiekt BOM
BOM – właściwości, metody:
NAVIGATOR - JavaScript BOM
window.navigator - obiekt dostarczający wiedzy o przeglądarce i jej możliwościach
window.navigator.userAgent - identyfikuje przeglądarkę
SCREEN - JavaScript BOM
Właściwość screen zawiera informacje na temat ustawień monitora np. dzięki właściwości:
screen.colorDepth - odczytasz głębię koloru monitora
screen.width - odczytasz szerokość monitora
screen. .height - odczytasz wysokość monitora
screen.availWidth - odczytasz dostępną szerokość monitora
screen.availHeight - odczytasz dostępną wysokość monitora
HISTORY - JavaScript BOM
Właściwość window.history daje programistom dostęp do stron odwiedzonych wcześniej w ramach tej samej sesji przeglądarki. Dodam, że jest to dostęp nieco ograniczony. „Podróżować” poprzez historię użytkownika możesz poprzez metody:
history.forward() - do przodu
history.back() - do tyłu
history.go(0) - przeładowanie bieżącej strony:
history.go(-1) – jedna strona wstecz
history.go(11) – jedenaście stron do przodu
LOCATION - JavaScript BOM
window.location - zawiera obiekt JavaScript przechowujący informacje o adresie URL aktualnie załadowanej strony
window.location.hostname - zawiera obiekt JavaScript przechowujący informacje o samej domenie
window.location.href - zawiera obiekt JavaScript przechowujący informacje o pełnym adresie strony internetowej
FRAMES - JavaScript BOM
Właściwość window.frames przechowuje zbiór ramek z bieżącej strony, zarówno zwykłe, jak i pływające ramki iframe. Właściwość window.frames zawsze jest zdefiniowane i wskazuje window.
window.frames = = = window – daje w console.log – true
WINDOW – obiekt główny – JavaScript dla przeglądarek
Teraz pora na ważne metody obiektu window.
window.open()- JavaScript pozwalająca otwierać nowe okna przeglądarki, tzw. okienka pop-up
metoda window.open potrzebuje (pobiera) elementy:
var poswojsku = window.open('adres internetowy', 'nazwę nowego okna’, 'szerokość okna, wysokość okna, status-tzn. info czy pasek stanu ma być wyświetlony');
var poswojsku= window.open('https://poswojsku.info', 'edukacja z poswojsku.info', 'width=500,height=500,resizable=yes');
window.close() - JavaScript zamyka nowe okno
window.moveTo(x,y) - JavaScript przenosi okno przeglądarki na pozycję x, y
window.moveBy(x,y) - JavaScript przenosi okno przeglądarki o wartościx, y
window.resizeTo(x,y)- JavaScript zmienia rozmiar okna o parametry x,y
window.alert() - JavaScript otwiera okienko z alertem – informacją dla użytkownika
window.prompt() - JavaScript otwiera okienko z polem do wprowadzeniu tekstu – pobiera tekst od użytkownika
window.confirm() - JavaScript otwiera okienko z możliwością wyboru dla użytkownika pomiędzy: OK i Anuluj
window.setTimeout() - JavaScript ustawia opóźnienie wykonania funkcji, przykład:
function uwazaj(){alert('uważaj na słonie ?');}
setTimeout(uwazaj, 2000);
JavaScript - powyższy kod wyświetli napis ‘uważaj na słonie ?’ z opóźnieniem 2000 milisekund (2 sekund)
co zrobić, aby nie wyświetlił się napis?
var stop = setTimeout(uwazaj, 2000);
clearTimeout(stop);
window.setInterval() - ustawia interwał, powoduje wielokrotne wywołania kodu co pewien okres czasu
teraz wywołamy funkcję uwazaj() w taki sposób, by była uruchamiana co trzy sekundy aż do momentu anulowania planu wywołań za pomocą clearInterval(stop).
var id = setInterval(uwazaj, 2000);
I teraz masz gwarancję, że wkurzysz użytkowników swojej strony.
HTML DOM Document Object Model – Model Obiektowy Dokumentu - najważniejsze elementy
Dziękuję wraz z JavaScript za uwagę
Zapraszam do kolejnej części szkolenia:
JavaScript obiektowy język programowania
Zobacz w menu podobne artykuły do: JavaScript obiektowy język programowania