Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
|
|
- Nina Kołodziejczyk
- 8 lat temu
- Przeglądów:
Transkrypt
1 Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk
2 Moduł 6 JavaScript w przeglądarce
3 Agenda Skrypty na stronie internetowej Model DOM AJAX
4 Skrypty na stronie internetowej Gdzie umieszczać skrypty? Znacznik <script>
5 Gdzie umieszczać skrypty? Skrypty JavaScript można umieszczać: w elementach HTML (przypisując skrypt bezpośrednio do zdarzenia w elemencie) w znaczniku script wewnątrz strony internetowej w osobnym pliku
6 Znacznik <script> Znacznik, w którym można umieszczać skrypty JavaScript <script type="text/javascript"> alert("ala ma kota"); </script> Może być umieszczony w dowolnym miejscu strony Renderowanie strony zostanie zatrzymane do momentu wykonania skryptu
7 Model DOM Czym jest model DOM? Pobieranie elementów modelu DOM Manipulowanie elementami modelu DOM Zdarzenia
8 Czym jest model DOM? DOM (ang. Document Object Model) Model umożliwiający obiektowy opis strony internetowej oraz podstawowe API pozwalające na wykonywanie operacji na strukturze dokumentu W modelu tym strona przedstawiana jest w postaci drzewa, gdzie: Węzłami wewnętrznymi, są zawsze tagi HTML Liśćmi drzewa są tagi HTML, lub elementy tekstowe
9 Czym jest model DOM? <html> <head> <title>przyklad</title> <style> h {color:red} </style> </head> <body> <h1>naglowek</h1> <p>jakis tekst <span>cos</span> <a href="adres"> link </a> </p> </body> </html> title head style document h1 body span p a
10 Czym jest model DOM? Każdy węzeł posiada m. in następujące właściwości i metody Właściwości attributes[] classname id innerhtml nodename nodetype nodevalue style Metody appendchild clonechild createtextnode hasattribute / hasattributes getattribute / getattributes haschildnodes insertbefore removeattribute removechild replacechild
11 Pobieranie elementów modelu DOM Do elementów modelu DOM możemy dostać się za pomocą jednej z trzech funkcji: document.getelementbyid document.getelementsbytagname document.getelementsbyclassname <h1 id="naglowek">zawartosc</h1> <script type="text/javascript"> var element = document.getelementbyid("naglowek"); </script> Dostęp do elementów modelu DOM możliwy jest dopiero po jego załadowaniu i wygenerowaniu
12 Manipulowanie elementami modelu DOM Elementy drzewa DOM można modyfikować (dodawać, modyfikować, usuwać) z poziomu JavaScript. Zamiast wykorzystywać jednak wbudowane funkcje JavaScript bezpośrednio wygodniej jest korzystać z bibliotek np. JQuery. <h1 id="naglowek">zawartosc</h1> <script type="text/javascript"> var element = document.getelementbyid("naglowek"); element.innerhtml = "Ala ma kota"; </script>
13 Zdarzenia (1) Zdarzenie - umożliwia obiektowi powiadomić inne obiekty o zmianie swego stanu. Procedura obsługi zdarzenia - funkcja, której kod ma się wykonać w momencie wystąpienia danego zdarzenia. Akcja domyślna - działanie, które przeglądarka normalnie wykonuje, w momencie wystąpienia danego zdarzenia. Akcje domyślne przypisane są do takich zdarzeń, jak: naciśnięcie linku przez użytkownika zatwierdzenie formularza przeniesienie "focus" do następnego elementu, gdy użytkownik naciśnie klawisz TAB.
14 Zdarzenia (2) Procedurę obsługi zdarzenia można przypisać bezpośrednio: element.onzdarzenie = proceduraobslugizdarzenia przykład: function linkonclick() { alert("komunikat"); } var link = document.getelementbyid("link"); link.onclick = linkonclick;
15 Zdarzenia (3) Z tradycyjnym modelem obsługi zdarzeń w JavaScriptwiąże się kilka problemów: brak możliwości przypisania więcej niż jednej funkcji do danego zdarzenia. w sytuacji, gdy użytkownik kliknie na link w stronie: function kliknieciediv() { alert("kliknieciediv"); } function kliknieciea() { alert("kliknieciea"); } <div click="kliknieciediv"> <a href="strona.html" click=" kliknieciea">link</a> </div>
16 Zdarzenia (4) Event listener Za pomocą tzw. "Event listeners" można, do pojedynczego elementu, przypisać wiele procedur obsługi zdarzeń. element.addeventlistener("zdarzenie", procobslugi, przechwytuj) function linkonclick() { alert("komunikat"); } var link = document.getelementbyid("link"); link.addeventlistener("click",linkonclick, false);
17 Zdarzenia (5) Do właściwości i metod obiektu, który wywołał dane zdarzenie, można dostać się za pomocą słowa kluczowego this. function onclick() { alert(this.innerhtml); return false; } var element1 = document.getelementbyid("link1"); var element2 = document.getelementbyid("link2"); element1.addeventlistener("click", onclick, false); element2.addeventlistener("click", onclick, false); <a href=" id="link1">link do onet.pl</a> <a href=" id="link2">link do wp.pl</a>
18 Zdarzenia (6) Zdarzenia load, DOMContentLoaded pozwalają na wykonywanie kodu w momencie całkowitego załadowania strony, załadowania drzewa DOM. <!DOCTYPE html> <html><head> <script type="text/javascript"> window.addeventlistener("load", function () { alert("onload"); }, false); document.addeventlistener("domcontentloaded", function() { alert("ondomloaded"); }, false); </script></head> <body> <h1 id="naglowek">naglowek</h1> <p id="tresc">tresc <img src="obraz.jpg" /></p> </body> </html>
19 Zdarzenia (7) Obiekt event umożliwia dostęp do dodatkowych informacji dotyczących się danego zdarzenia. Właściwości altkey, ctrlkey, shiftkey Bubbles button* cancelable charcode clientx, clienty keycode eventphase target type Metody preventdefault() stoppropagation()
20 AJAX Czym jest AJAX? XMLHttpRequest JSON
21 Czym jest AJAX? (1) AJAX = Asynchronous JavaScript and XML AJAX pozwala na tworzenie aplikacji internetowych w taki sposób aby odczucia użytkownika były jak najbardziej zbliżone do aplikacji desktopowych. W skład AJAX wchodzą: Standardowa reprezentacja internetowa HTML + CSS Document Object Model XML JavaScript XMLHttpRequest
22 Czym jest AJAX? (2) Klasyczny model aplikacji WWW KLIENT Interfejs żądanie HTTP HTML + CSS Serwer HTTP Systemy dodatkowe SERWER
23 Czym jest AJAX? (3) Interakcja synchroniczna KLIENT aktywność użytkownika aktywność użytkownika aktywność użytkownika CZAS SERWER przetwarzanie przetwarzanie
24 Czym jest AJAX? (4) Model aplikacji AJAX JavaScript KLIENT Interfejs HTML + CSS Silnik AJAX żądanie HTTP XML / JSON / HTML + CSS Serwer HTTP Systemy dodatkowe SERWER
25 Czym jest AJAX? (5) Interakcja synchroniczna aktywność użytkownika wejście wejście wejście KLIENT przetwarzanie wyjście wyjście wyjście CZAS SERWER przetwarzanie przetwarzanie
26 XMLHttpRequest(1) Obiekt XMLHttpRequest jest rdzennym elementem AJAX-u odpowiedzialnym za obsługę komunikacji klienta z serwerem. Pozwala na wysyłanie żądania HTTP lub HTTPS bezpośrednio do serwera HTTP, z poziomu języka skryptowego, oraz odbierania odpowiedzi również z poziomu języka skryptowego. XMLHttpRequest jest dostępny jako obiekt JavaScript.
27 XMLHttpRequest(2) Właściwości i zdarzenia Nazwa Opis status Kod odpowiedzi serwera statustext Opis statusu readystate Wartość liczbowa wskazująca obecny stan obiektu responsetext Odpowiedź serwera w postaci łańcucha tekstowego responsexml Odpowiedź serwera w postaci łańcucha XML Nazwa onreadystatechange Opis Funkcja obsługizdarzenia wywoływana, gdy zmieni się stan obiektu
28 XMLHttpRequest(3) Metody Nazwa abort() getallresponseheaders() getresponseheader("nazwa") open("metoda", "URL", asyncflag, "login", "haslo") send(treść) setrequestheader("nazwa", "wartość") Opis Anuluje obecne żądanie HTTP pobiera wartości nagłówków HTTP z odpowiedzi serwera zwraca wartośc nagłówka HTTP o podanej nazwie Inicjalizuje żądanie wysyła żądanie HTTP do serwera i odbiera odpowiedź Ustawia wartość nagłówka żądania HTTP
29 XMLHttpRequest(4) Właściwość readystate Kod Nazwa Opis 0 Niezainicjalizowany obiekt nie jest zainicjalizowany 1 Wczytywany obiekt wczytuje dane 2 Załadowany obiekt wczytał dane 3 Interaktywny możliwa jest interakcja z obiektem, choć może on nie być w pełni zainicjalizowany 4 Gotowy obiekt jest w pełni zainicjalizowany
30 JSON JavaScript Object Notation { "Imie": "Łukasz", "Nazwisko": "Bartczuk" } [{ "Imie": "Łukasz", "Nazwisko": "Bartczuk"}, { "Imie": "Piotr", "Nazwisko": "Dziwiński"}]
Czym jest AJAX. AJAX wprowadzenie. Obiekt XMLHttpRequest (XHR) Niezbędne narzędzia. Standardowy XHR. XHR z obsługą baz danych
Czym jest AJAX AJAX wprowadzenie Beata Pańczyk na podstawie: 1. Lis Marcin, Ajax, Helion, 2007 2. Hadlock Kris, Ajax dla twórców aplikacji internetowych, Helion, 2007 AJAX (Asynchronous JavaScript and
Bardziej szczegółowoRys.2.1. Drzewo modelu DOM [1]
1. CEL ĆWICZENIA Celem ćwiczenia jest przedstawienie możliwości wykorzystania języka JavaScript do tworzenia interaktywnych aplikacji działających po stronie klienta. 2. MATERIAŁ NAUCZANIA 2.1. DOM model
Bardziej szczegółowoPodstawy programowania w języku JavaScript
Podstawy programowania w języku JavaScript Część piąta AJAX Autor Roman Simiński Kontakt roman.siminski@us.edu.pl www.siminskionline.pl Niniejsze opracowanie zawiera skrót treści wykładu, lektura tych
Bardziej szczegółowoTworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 7 jquery Agenda Czym jest jquery? Podstawowe zasady jquery Selektory jquery Model DOM i jquery Zdarzenia
Bardziej szczegółowoPogadanka o czymś, co niektórzy nazywają AJAX
Pogadanka o czymś, co niektórzy nazywają AJAX Bartłomiej Świercz Katedra Mikroelektroniki i Technik Informatycznych Łódź, 25 listopada 2005 roku Nowy świat aplikacji internetowych... System/przeglądarka
Bardziej szczegółowoPaweł Rajba, pawel.rajba@continet.pl
Paweł Rajba, pawel.rajba@continet.pl Wprowadzenie Zalety Wady XMLHttpRequest AJAX w praktyce AJAX + jquery Literatura Z czego się składa? JavaScript + DOM Obiekt XMLHttpRequest Jakakolwiek technologia
Bardziej szczegółowoXML extensible Markup Language. część 5
XML extensible Markup Language część 5 JavaScript Co to jest JavaScript? JavaScript był zaprojektowany w celu dodania interaktywności do stron HTML JavaScript jest językiem skryptowym JavaScript jest zwykle
Bardziej szczegółowoJQuery. $('#pierwszy').css('color','red').hide('slow').show(3000); $(document).ready(function() { //... tutaj nasze skrypty jquery //...
JQuery jquery (jquery.com) to jedna z najbardziej popularnych bibliotek/frameworków do javascript. Jej popularność oczywiście znikąd się nie bierze. Dzięki tej bibliotece jesteśmy w stanie o wiele szybciej
Bardziej szczegółowoJavaScript obiektowość
JavaScript obiektowość WWW 27 kwietnia 2017 Od funkcyjności do obiektowości Wyrażenie regularne DOM Zdarzenia Obiekty w JS Intuicja Obiekty nie maja przypisanych klas, natomiast maja przypisane konstruktory.
Bardziej szczegółowoAJAX. Wykonał: Marcin Ziółkowski, AGH Kraków, AiR rok 5.
AJAX Wykonał: Marcin Ziółkowski, AGH Kraków, AiR rok 5. Czym jest AJAX? AJAX (Asynchronous JavaScript And XML) nie jest nową technologią, ale nowym sposobem wykorzystania kombinacji istniejących technologii
Bardziej szczegółowoAjax. Æwiczenia IDZ DO KATALOG KSI EK TWÓJ KOSZYK CENNIK I INFORMACJE CZYTELNIA PRZYK ADOWY ROZDZIA. SPIS TREœCI KATALOG ONLINE
IDZ DO PRZYK ADOWY ROZDZIA SPIS TREœCI KATALOG KSI EK KATALOG ONLINE Ajax. Æwiczenia Autor: Marcin Lis ISBN: 83-246-0686-6 Format: A5, stron: 168 Przyk³ady na ftp: 32 kb ZAMÓW DRUKOWANY KATALOG TWÓJ KOSZYK
Bardziej szczegółowoTworzenie Stron Internetowych. odcinek 10
Tworzenie Stron Internetowych odcinek 10 JavaScript JavaScript (ECMAScript) skryptowy język programowania powszechnie używany w Internecie. Skrypty JS dodają do stron www interaktywność i funkcjonalności,
Bardziej szczegółowoZajęcia 4 - Wprowadzenie do Javascript
Zajęcia 4 - Wprowadzenie do Javascript Co to jest Javascript Javascript jest językiem skryptowym pozwalającym na dołączanie dodatkowej funkcjonalności do stron WWW. Jest ona najczęściej związana z modyfikacją
Bardziej szczegółowoDOM (Document Object Model)
DOM (Document Object Model) Czym jest DOM? Platforma, która pozwala skryptom na dynamiczny dostęp do zawartości strony i jej aktualizację. Elementy można dodawać, zmieniać lub usuwać. Specyfikacje Poziomy
Bardziej szczegółowoTworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 5 Podstawy JavaScript Agenda Czym jest JavaScript? Podstawowe typy danych Zmienne Tablice Funkcje Zakres
Bardziej szczegółowoZdarzenia Zdarzenia onload i onunload
Zdarzenia Zdarzenia onload i onunload Ćwiczenie 1. Rysunek 1. Okno powitalne wykorzystujące zdarzenie onload Na stronie mogą zachodzić różne zdarzenia, np. użytkownik kliknie myszą lub zacznie wprowadzać
Bardziej szczegółowoWykład 03 JavaScript. Michał Drabik
Wykład 03 JavaScript Michał Drabik Język programowania wykorzystywany na stronach internetowych głównie w celu umożliwienia interakcji z użytkownikiem. Kod JavaScript może być umieszczany w kodzie XHTML
Bardziej szczegółowoXML extensible Markup Language. część 5
XML extensible Markup Language część 5 XML ważne zastosowanie Jak często pracujemy z plikami XML? Wróćmy jeszcze do wykładu poprzedniego. A dokładnie do pliku zawierającego ten wykład. xml_2017_wyklad_4.pptx
Bardziej szczegółowoHTML DOM, XHTML cel, charakterystyka
HTML DOM, XHTML cel, charakterystyka Mariusz Kacała Łukasz Przywarty Grzegorz Trawiński HTML DOM XHTML Ramowy plan prezentacji Wstęp HTML DOM - Założenia - Model i struktura - Właściwości - Metody i zastosowania
Bardziej szczegółowoPrzetwarzanie dokumentów XML i zaawansowane techniki WWW Zdarzenia w JavaScript (Zajęcia r.)
Przetwarzanie dokumentów XML i zaawansowane techniki WWW Zdarzenia w JavaScript (Zajęcia 08 25.04.2016 r.) 1) Zdarzenia w JavaScript Zdarzenia są sygnałami generowanymi w chwili wykonywania ściśle określonych
Bardziej szczegółowoZaawansowane aplikacje internetowe AJAX. Wykład prowadzi: Marek Wojciechowski AJAX
AJAX Wykład prowadzi: Marek Wojciechowski AJAX 1 Plan wykładu Czym jest AJAX? Technologie składowe AJAX XMLHttpRequest: Asynchroniczna komunikacja z serwerem Przykład prostej aplikacji AJAX Przykładowe
Bardziej szczegółowoZaawansowane aplikacje internetowe
Zaawansowane aplikacje internetowe AJAX 1 Celem tego laboratorium jest pokazanie moŝliwości technologii AJAX. W ramach ćwiczeń zostanie zbudowana prosta aplikacja, przechwytująca kliknięcia uŝytkownika
Bardziej szczegółowoSpis wzorców. Działania użytkownika Strona 147 Obsługa większości Działań użytkownika za pomocą kodu JavaScript przy użyciu metod obsługi zdarzeń.
Spis wzorców Aplikacja Ajax Strona 73 Tworzenie Aplikacji Ajax złożonych aplikacji, które można uruchomić w dowolnej współczesnej przeglądarce internetowej. Bezpośrednie logowanie Strona 509 Uwierzytelnianie
Bardziej szczegółowoKrótki kurs JavaScript
Krótki kurs JavaScript Java Script jest językiem wbudowanym w przeglądarkę. Gdy ma się podstawy nabyte w innych językach programowania jest dość łatwy do opanowania. JavaScript jest stosowany do powiększania
Bardziej szczegółowoTechniki WWW. (HTML, CSS, JavaScript) Dr inż. Marcin Zieliński WYKŁAD 7. Środa 15:30-17:00 sala: A-1-04
Techniki WWW (HTML, CSS, JavaScript) Dr inż. Marcin Zieliński WYKŁAD 7 Wykład dla kierunku: Informatyka Stosowana II rok Rok akademicki: 2016/2017 - semestr zimowy Środa 15:30-17:00 sala: A-1-04 Przypomnienie
Bardziej szczegółowoAngular, cz. II. Tworzenie serwisów Web 2.0. dr inż. Robert Perliński rperlinski@icis.pcz.pl
ngular, cz. II 1/24 Angular, cz. II Tworzenie serwisów Web 2.0 dr inż. Robert Perliński rperlinski@icis.pcz.pl Politechnika Częstochowska Instytut Informatyki Teoretycznej i Stosowanej 10 kwietnia 2015
Bardziej szczegółowoAplikacje internetowe
Aplikacje internetowe Podstawy programowania w języku JavaScript Roman Simiński roman.siminski@us.edu.pl www.siminskionline.pl Tworzenie prostych programów w środowisku przeglądarki W jaki sposób umieszczany
Bardziej szczegółowoPrzetwarzanie dokumentów XML i zaawansowane techniki WWW Wykład 05
Plan Przetwarzanie dokumentów XML i zaawansowane techniki WWW Wykład 05 T. Romańczukiewicz Jagiellonian University 2009/2010 Plan Plan 1 DOM 2 DOM w innych językach 3 Podsumowanie Plan DOM DOM w innych
Bardziej szczegółowoXML extensible Markup Language 6
XML extensible Markup Language 6 XML DOM XML DOM zawiera metody (funkcje) pozwalające przeglądać drzewo XML: pobierać, wstawiać oraz usuwać jego węzły. Aby móc manipulować dokumentem XML musi on być załadowany
Bardziej szczegółowoKompresja stron internetowych
Kompresja stron internetowych Patryk Jar Tech 3 Camp, 18 czerwca 2013 r. O mnie Patryk Jar Webdeveloper Nor-sta (nor-sta.eu) yarpo.pl 2 3 Agenda Lepszy kod w przeglądarce Mniej żądań HTTP Mniej danych
Bardziej szczegółowoREFERAT O PRACY DYPLOMOWEJ
REFERAT O PRACY DYPLOMOWEJ Temat pracy: Projekt i budowa systemu zarządzania treścią opartego na własnej bibliotece MVC Autor: Kamil Kowalski W dzisiejszych czasach posiadanie strony internetowej to norma,
Bardziej szczegółowoWYKŁAD 1 ANGULARJS CZĘŚĆ 1
WYKŁAD 1 ANGULARJS CZĘŚĆ 1 DEFINICJA ANGULARJS Framework JavaScript na licencji open-source wykorzystywany do tworzenia aplikacji SPA (single page applications) w oparciu o wzorzec projektowy Model-View-Controler.
Bardziej szczegółowoDokumentacja imapliteapi
Dokumentacja imapliteapi Urząd Marszałkowski Województwa Małopolskiego 30.06.2014 Spis treści: 1. Wprowadzenie... 3 2. Sposób użycia biblioteki imapliteapi... 3 3. Metody API... 5 4. Lista gotowych kompozycji
Bardziej szczegółowoServer setup. #include <SPI.h> #include <Ethernet.h> boolean incoming = 0;
Server setup #include #include boolean incoming = 0; byte mac[] = 0x00, 0xAA, 0xBB, 0xCC, 0xDA, 0x02 ; IPAddress ip(192,168, 0, 230); EthernetServer server(80); void setup() pinmode(2,
Bardziej szczegółowoSzczegółowy opis zamówienia:
Szczegółowy opis zamówienia: Rok 2016 budowa stron w html5 (8h v + 4h ćw) 8 szt. html5 - zaawans. (7h v + 5h ćw) 8 szt. programowania w java script (9h v + 7h ćw) 8 szt. java script zaawans (8h v + 4h
Bardziej szczegółowoWYKŁAD 4 JĘZYK JAVASCRIPT CZĘŚĆ 1
WYKŁAD 4 JĘZYK JAVASCRIPT CZĘŚĆ 1 DEFINICJA JAVASCRIPT (oficjalna nazwa ECMA-262, ECMAScript 6 czerwiec 2015r.) Skryptowy język programowania, którego celem jest dodanie dynamiki do możliwości HTML'a.
Bardziej szczegółowoWYKŁAD 5 BIBLIOTEKA JQUERY CZĘŚĆ 1
WYKŁAD 5 BIBLIOTEKA JQUERY CZĘŚĆ 1 CZYM JEST JQUERY? Biblioteka napisana w języku JavaScript, oparta na zasadzie write less, do more. Celem jej powstania było uproszczenie stosowania JavaScript na stronach.
Bardziej szczegółowoWYKŁAD 3 XML DOM XML DOCUMENT OBJECT MODEL CZĘŚĆ 1
WYKŁAD 3 XML DOM XML DOCUMENT OBJECT MODEL CZĘŚĆ 1 XML DOM (ang. XML Document Object Model Obiektowy Model Dokumentu XML) Inaczej drzewo DOM to hierarchiczny, obiektowy model dokumentu XML. DOM to platforma
Bardziej szczegółowoPrzykład integracji kalkulatora mbank RATY na platformie IAI
Przykład integracji kalkulatora mbank RATY na platformie IAI 1. Moderacja - > Dodatki HTML i JavaScript 1.1 Klikamy na przycisk nowy dodatek Wpisujemy w pole Tytuł dodatku nazwę CSS_mRaty. Następnie ustawiamy
Bardziej szczegółowoZrąb JavascriptMVC. Krzysztof Płocharz. 6 kwiecień 2009. Uniwersytet Warszawski
Uniwersytet Warszawski 6 kwiecień 2009 Spis Treści 1 MVC Jak to wygląda w JavascriptMVC 2 Prawie jak klasy 3 Hierarchia Widoki Kontrolery Modele 4 Struktura katalogów Generatory kodu Generatory dokumentacji
Bardziej szczegółowoO stronach www, html itp..
O stronach www, html itp.. Prosty wstęp do podstawowych technik spotykanych w internecie 09.01.2015 M. Rad Plan wykładu Html Przykład Strona www Xhtml Css Php Js HTML HTML - (ang. HyperText Markup Language)
Bardziej szczegółowoTworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk
Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery Łukasz Bartczuk Moduł 3 Formularze Agenda Podstawy formularzy HTML Podstawowe kontrolki formularzy HTML Nowe kontrolki z HTML
Bardziej szczegółowoDokumentacja interfejsu HTTPD. Platforma BSMS.PL Instrukcja podłączenia po przez http
Dokumentacja interfejsu HTTPD Platforma BSMS.PL Instrukcja podłączenia po przez http Dokumentacja interfejsu httpd (strona 2) SPIS TREŚCI 1. Zawartość dokumentu str.3 2. Informacje ogólne 2.1 Zastosowanie
Bardziej szczegółowoREACT NATIVE. Anna Maziejuk Kamil Jankowski
REACT NATIVE Anna Maziejuk Kamil Jankowski React Native Framework/biblioteka bazujący na React Pozwala na tworzenie aplikacji tylko za pomocą języka JavaScript Wspiera platformy ios i Android REACT React
Bardziej szczegółowoŹródła. cript/1.5/reference/ Ruby on Rails: http://www.rubyonrails.org/ AJAX: http://www.adaptivepath.com/publications/e ssays/archives/000385.
Źródła CSS: http://www.csszengarden.com/ XHTML: http://www.xhtml.org/ XML: http://www.w3.org/xml/ PHP: http://www.php.net/ JavaScript: http://devedgetemp.mozilla.org/library/manuals/2000/javas cript/1.5/reference/
Bardziej szczegółowoZastosowanie technologii Ajax w ramach technologii JavaServer Faces wg
Zastosowanie technologii Ajax w ramach technologii JavaServer Faces wg https://docs.oracle.com/javaee/7/jeett.pdf http://www.coreservlets.com Technologie internetowe 8 Technologie internetowe 8, Zofia
Bardziej szczegółowoWybrane działy Informatyki Stosowanej
Wybrane działy Informatyki Stosowanej Aplikacje WWW. Statyczne oraz dynamiczne strony WWW. Skrypty po stronie klienta. Dr inż. Andrzej Czerepicki a.czerepicki@wt.pw.edu.pl http://www2.wt.pw.edu.pl/~a.czerepicki
Bardziej szczegółowoFormat HTML. Wybrane działy Informatyki Stosowanej. Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty
Wybrane działy Informatyki Stosowanej Format HTML Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty dr hab. inż. Andrzej Czerepicki 2019 Definicja HTML HyperText Markup Language
Bardziej szczegółowoAjax. 1. Wprowadzenie. 2. Aplikacja serwerowa
Ajax 1. Wprowadzenie Do tej pory każda akcja na Waszej stronie kończyła się nowym requestem do serwera i przeładowaniem całej strony w przeglądarce. W tej instrukcji dodamy elementy asynchroniczne na stronie,
Bardziej szczegółowoPrzygotowanie do nowoczesnego programowania po stronie przeglądarki. (HTML5, CSS3, JS, wzorce, architektura, narzędzia)
Program szkolenia: Przygotowanie do nowoczesnego programowania po stronie przeglądarki (HTML5, CSS3, JS, wzorce, architektura, narzędzia) Informacje: Nazwa: Kod: Kategoria: Grupa docelowa: Czas trwania:
Bardziej szczegółowoSUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania. Wykład 2. dr Artur Bartoszewski - WYKŁAD: Języki i Systemy Programowania,
SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Wykład 2 1 SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Przekierowania 2 Przekierowanie za pomocą skryptu Przykład
Bardziej szczegółowoGenerated by Foxit PDF Creator Foxit Software http://www.foxitsoftware.com For evaluation only. System Szablonów
System Szablonów System szablonów System szablonów to biblioteka, która pozwala oddzielić warstwę prezentacji od warstwy logicznej. Aplikacja WWW najpierw pobiera wszystkie dane, przetwarza je i umieszcza
Bardziej szczegółowoCZYM JEST JAVASCRIPT?
JAVASCRIPT JAVASCRIPT - CECHY Język skryptowy stosowany w sieci WWW Stosowany przez autorów witryn WWW głównie w celu: poprawy wyglądu stron walidacji danych z formularzy wykrywania typu przeglądarki tworzenia
Bardziej szczegółowoI Podstawy... 13. 1 Wprowadzenie do technologii Ajax... 15. 2 Żądanie... 19. 3 Odpowiedź... 31 XML 31 JSON 39
Spis treści O autorze... 9 Przedmowa... 11 I Podstawy... 13 1 Wprowadzenie do technologii Ajax... 15 Obiektowy model dokumentu XML 16 Zestawienie korzyści 16 2 Żądanie... 19 XMLHttpRequest od podszewki
Bardziej szczegółowoAjax. Wzorce i najlepsze rozwi¹zania
Ajax. Wzorce i najlepsze rozwi¹zania Autor: Christian Gross T³umaczenie: Maciej Jezierski ISBN: 83-246-0554-1 Tytu³ orygina³u: Ajax Patterns and Best Practices Format: B5, stron: 392 Wydawnictwo Helion
Bardziej szczegółowoWybrane działy Informatyki Stosowanej
Wybrane działy Informatyki Stosowanej Aplikacje WWW. Statyczne oraz dynamiczne strony WWW. Skrypty po stronie klienta. dr hab. inż. Andrzej Czerepicki a.czerepicki@wt.pw.edu.pl http://www2.wt.pw.edu.pl/~a.czerepicki
Bardziej szczegółowoProtokół HTTP. 1. Protokół HTTP, usługi www, model request-response (żądanie-odpowiedź), przekazywanie argumentów, AJAX.
Protokół HTTP 1. Protokół HTTP, usługi www, model request-response (żądanie-odpowiedź), przekazywanie argumentów, AJAX. 1 Usługi WWW WWW (World Wide Web) jest najpopularniejszym sposobem udostępniania
Bardziej szczegółowoAplikacje WWW. Możliwość wykorzystania elementów interfejsu użytkownika znanych z aplikacji Windows tj. wskaźniki postępu.
Laboratorium z przedmiotu Aplikacje WWW - zestaw 07 Cel zajęć. Celem zajęć jest zapoznanie się z technologią AJAX w aplikacjach WWW. Wprowadzenie teoretyczne. Rozważana w ramach niniejszych zajęć tematyka
Bardziej szczegółowoTablica zawierająca odniesienia do znajdujących się w dokumencie obiektów typu Anchor.
Obiekt document służy do reprezentacji wczytanego do przeglądarki dokumentu HTML oraz zawiera szereg właściwości i metod pozwalających na jego modyfikację. Poprzez ten obiekt można otrzymać dostęp praktycznie
Bardziej szczegółowoJavaScript - wykład 4. Zdarzenia i formularze. Obsługa zdarzeń. Zdarzenia. Mysz. Logiczne. Klawiatura. Beata Pańczyk
Obsługa zdarzeń JavaScript - wykład 4 Zdarzenia i formularze Beata Pańczyk zdarzenia - wszystko co zachodzi w związku z obiektami JavaScript (np. window) i elementami XHTML przeglądarka moŝe wywołać funkcję
Bardziej szczegółowoWspółdziałanie przeglądarki i skryptów w pliku HTML (lub XML), oraz współdziałanie przeglądarki i ekranu ilustruje niżej położony rysunek.
Obiektowy model przeglądarki (BOM, Browser Object Model) Współdziałanie przeglądarki i skryptów w pliku HTML (lub XML), oraz współdziałanie przeglądarki i ekranu ilustruje niżej położony rysunek. Plik
Bardziej szczegółowoTworzenie Stron Internetowych. odcinek 9
Tworzenie Stron Internetowych odcinek 9 Prosta galeria oparta na HTML Najprostszym sposobem zbudowania galerii zdjęć jest wykorzystanie tylko HTML i CSS. Strona główna galerii składa się miniatur zdjęć,
Bardziej szczegółowoPLAN WYNIKOWY PROGRAMOWANIE APLIKACJI INTERNETOWYCH. KL III TI 4 godziny tygodniowo (4x30 tygodni =120 godzin ),
PLAN WYNIKOWY PROGRAMOWANIE APLIKACJI INTERNETOWYCH KL III TI 4 godziny tygodniowo (4x30 tygodni =120 godzin ), Program 351203 Opracowanie: Grzegorz Majda Tematyka zajęć 1. Wprowadzenie do aplikacji internetowych
Bardziej szczegółowoFacelets ViewHandler
JSF i Facelets Wprowadzenie JSP (JavaServer Pages) są natywną i najczęściej używaną technologią do tworzenia warstwy prezentacyjnej dla JSF (JavaServer Faces) Istnieją alternatywne technologie opisu wyglądu
Bardziej szczegółowoCzęść I Powtórka z technologii internetowych...15
O autorze...9 Wprowadzenie...11 O książce... 11 Czym jest Ajax?... 12 Dla kogo przeznaczona jest ta książka... 13 Czego potrzebuję, aby skorzystać z tej książki?... 13 Konwencje użyte w książce... 14 Część
Bardziej szczegółowoAplikacje WWW - laboratorium
Aplikacje WWW - laboratorium PHP. Celem ćwiczenia jest przygotowanie prostej aplikacji internetowej wykorzystującej technologię PHP. Aplikacja pokazuje takie aspekty, obsługa formularzy oraz zmiennych
Bardziej szczegółowoSpis treści. Wstęp 5 Rozdział 1. Praca z AJAX-em 9. Rozdział 2. Współpraca ze skryptami PHP 55. Rozdział 3. Obsługa formularzy 81
Spis treści Wstęp 5 Rozdział 1. Praca z AJAX-em 9 Pierwszy przykład 9 Obiekt XMLHttpRequest 12 Transmisja danych 21 Model DOM 34 Obsługa wielu żądań 45 Rozdział 2. Współpraca ze skryptami PHP 55 Odbieranie
Bardziej szczegółowoW ogólności znaczniki mogą również posiadać atrybuty które pozwalają wpływać i manipulować własnościami znaczników lub przenosić dodatkowe informacje:
Projektowanie aplikacji internetowych (zajęcia 6.03.2017 r.) Zajęcia: grupa 3: środa 16:00-17:30 Prowadzący: Dr inż. Marcin Zieliński marcin.zielinski@uj.edu.pl pokój: B-2-33 (Zakład Fizyki Jądrowej) konsultacje:
Bardziej szczegółowoAplikacje internetowe
Temat: Język HTML i style CSS Aplikacje internetowe Pracownia specjalistyczna, studia podyplomowe, rok 2011/2012 1. Stwórz formularz HTML pozwalający na rejestrację użytkownika w aplikacji internetowej.
Bardziej szczegółowoBazy Danych i Usługi Sieciowe
Bazy Danych i Usługi Sieciowe Język PHP Paweł Witkowski Wydział Matematyki, Informatyki i Mechaniki Jesień 2011 P. Witkowski (Wydział Matematyki, Informatyki i Mechaniki) BDiUS w. VIII Jesień 2011 1 /
Bardziej szczegółowoTECHNOLOGIE INTERNETOWE WYKŁAD 6. JavaScript Funkcje i obiekty
1. Co to jest funkcja? Funkcja jest oddzielnym blokiem kodu, który może być wielokrotnie wykonywany w danym programie, poprzez jej wielokrotne wywoływanie. Do funkcji przekazujemy przeważnie jakieś argumenty,
Bardziej szczegółowoJAVAScript w dokumentach HTML (1) JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania.
IŚ ćw.8 JAVAScript w dokumentach HTML (1) JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania. Skrypty JavaScript są zagnieżdżane w dokumentach HTML. Skrypt JavaScript
Bardziej szczegółowoAplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza HTML z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed wysłaniem
Bardziej szczegółowoObiektowy model dokumentu. Katedra Mikroelektroniki i Technik Informatycznych
Katedra Mikroelektroniki i Technik Informatycznych Łódź, 14 października 2005 roku Wstęp DOM Document Object Model zapewnia: Zbiór obiektów reprezentujących dokumenty XML i HTML. Model łączenia obiektów.
Bardziej szczegółowoPodstawy programowania w języku JavaScript
Podstawy programowania w języku JavaScript Część trzecia Funkcje i programowanie sterowane zdarzeniami Autor Roman Simiński Kontakt roman.siminski@us.edu.pl www.us.edu.pl/~siminski Niniejsze opracowanie
Bardziej szczegółowoHTML, CSS i JavaScript / Laura Lemay, Rafe Colburn, Jennifer Kyrnin. Gliwice, cop Spis treści
HTML, CSS i JavaScript / Laura Lemay, Rafe Colburn, Jennifer Kyrnin. Gliwice, cop. 2017 Spis treści O autorach 11 Wprowadzenie 13 CZĘŚĆ I ROZPOCZĘCIE PRACY Lekcja 1. Co oznacza publikowanie treści w sieci
Bardziej szczegółowoOpenLaszlo. OpenLaszlo
OpenLaszlo Spis Treści 1 OpenLaszlo Co to jest? Historia Idea Architektura Jako Flash lub DHTML Jako servlet lub SOLO Jak to działa? Język LZX Struktura programu Skrypty Obiekty i klasy Atrybuty i metody
Bardziej szczegółowoInstrukcja platformy wideo
Instrukcja platformy wideo Wstęp Platforma wideo służy do dystrybucji bezpłatnych filmów w Polskim Języku Migowym wyjaśniających osobom Głuchym jak załatwiać sprawy w urzędzie oraz jak wypełniać formularze.
Bardziej szczegółowoTOPIT Załącznik nr 3 Programowanie aplikacji internetowych
Szkolenie przeznaczone jest dla osób chcących poszerzyć swoje umiejętności o tworzenie rozwiązań internetowych w PHP. Zajęcia zostały przygotowane w taki sposób, aby po ich ukończeniu można było rozpocząć
Bardziej szczegółowoDOKUMENTACJA INTERFEJSU API - HTTPS
DOKUMENTACJA INTERFEJSU API - HTTPS WERSJA 0.1 DATA PUBLIKACJI : 01.03.2014 SPIS TREŚCI Spis treści Wprowadzenie 1 Dostęp do usługi notowania online 2 Opis struktur danych 3 Kody błędów 5 Historia wersji
Bardziej szczegółowoEfektywne tworzenie aplikacji webowych z wykorzystaniem AngularJS, HTML5 i JavaScript
Kod szkolenia: Tytuł szkolenia: HTML5/ANG Efektywne tworzenie aplikacji webowych z wykorzystaniem AngularJS, HTML5 i JavaScript Dni: 5 Opis: Adresaci szkolenia: Kurs przeznaczony jest dla programistów
Bardziej szczegółowoW tej części dowiemy się, jak rozszerzyć WordPress za pomocą JSON-API. Oto kilka rzeczy, które będziemy robić z wtyczką JSON-API:
Rozszerzanie WordPressa za pomocą JSON-API W tej części dowiemy się, jak rozszerzyć WordPress za pomocą JSON-API. Oto kilka rzeczy, które będziemy robić z wtyczką JSON-API: Rozszerz WordPress, eksponując
Bardziej szczegółowoPROJEKTOWANIE APLIKACJI INTERNETOWYCH
PROJEKTOWANIE APLIKACJI INTERNETOWYCH (WFAIS.IF-N016) dr inż. Marcin Zieliński Wykład dla kierunku: Informatyka Stosowana I rok, II stopień Rok akademicki: 2016/2017 - semestr letni WYKŁAD 2 Przypomnienie
Bardziej szczegółowoSzablon główny (plik guestbook.php) będzie miał postać:
Skrypt: Księga gości Skrypt generujący księgę gości będzie się składał z trzech części: szablonu głównego, który należy zapisać pod nazwą guestbook.php, formularza służącego do dodawania wpisów, który
Bardziej szczegółowoDOM SAX AJAX. SAX,DOMiAJAX. Bartłomiej Świercz. Katedra Mikroelektroniki i Technik Informatycznych. Łódź, 11 kwietnia 2010
DOM,DOMi Bartłomiej Świercz Katedra Mikroelektroniki i Technik Informatycznych Łódź, 11 kwietnia 2010 Bartłomiej Świercz, DOM i DOM Model DOM org.w3c.dom DOM Document Object Model zapewnia: Zbiór obiektów
Bardziej szczegółowoJAVAScript tablice, przekazanie danych do funkcji, obiekty Date i window
Programowanie obiektowe ćw.2 JAVAScript tablice, przekazanie danych do funkcji, obiekty Date i window Tablice w JavaScript Przykład zastosowania tablicy dla przekazania rezultatów funkcji do miejsca wywołania
Bardziej szczegółowoTECHNOLOGIE SIECI WEB
TECHNOLOGIE SIECI WEB Prowadzący: dr inż. Jan Prokop, e-mail: jprokop@prz.edu.pl, Politechnika Rzeszowska, Wydział Elektrotechniki i Informatyki LABORATORIUM ĆWICZENIE nr 8 Temat: Podstawy technologii
Bardziej szczegółowoDokumentacja Skryptu Mapy ver.1.1
Dokumentacja Skryptu Mapy ver.1.1 2 Dokumentacja Skryptu Mapy ver.1.1 Spis treści Dokumentacja skryptu... 3 Dodatkowe informacje i kontakt... 7 3 Dokumentacja Skryptu Mapy ver.1.1 Dokumentacja skryptu
Bardziej szczegółowoFront-end: solidne podstawy. Wszystko, co warto wiedzieć o HTML, CSS, JavaScript i Bootstrap.
Kod szkolenia: Tytuł szkolenia: FRONT-END Front-end: solidne podstawy. Wszystko, co warto wiedzieć o HTML, CSS, JavaScript i Bootstrap. Dni: 5 Opis: Adresaci szkolenia Kurs przeznaczony jest zarówno dla
Bardziej szczegółowoPodstawy programowania w języku JavaScript
Podstawy programowania w języku JavaScript Część trzecia DOM Document Object Model Autor Roman Simiński Kontakt roman.siminski@us.edu.pl www.us.edu.pl/~siminski Niniejsze opracowanie zawiera skrót treści
Bardziej szczegółowoSprawozdanie Sieci komputerowe i bazy danych Laboratorium nr 4
03.04.2017r AGH, WIMIR, Inżynieria Mechatroniczna Dawid Furdzik Nr albumu: 279671 Sprawozdanie Sieci komputerowe i bazy danych Laboratorium nr 4 Po wywołaniu polecenia odpowiedź serwera wygląda następująco:
Bardziej szczegółowoOkna, ramki i ciasteczka
Okna, ramki i ciasteczka Okna Ćwiczenie 6.1. Rysunek 6.1. Skrypt otwierający nowe okno przeglądarki po wciśnięciu przycisku Manipulację oknami umożliwia nam obiekt window. Jego właściwości i metody przedstawione
Bardziej szczegółowoSpis treści CZĘŚĆ I JĘZYK SIECI 17. Wstęp 13. Rozdział 1 Wprowadzenie do HTML5 19. Rozdział 2 Znajomość znaczników HTML5 37
Spis treści Wstęp 13 CZĘŚĆ I JĘZYK SIECI 17 Rozdział 1 Wprowadzenie do HTML5 19 Tworzenie przy pomocy znaczników: przegląd 20.Wprowadzanie nowych elementów HTML5 21 Korzystanie z kontynuowanych znaczników
Bardziej szczegółowoAplikacje internetowe - laboratorium
Aplikacje internetowe - laboratorium PHP Celem ćwiczenia jest przygotowanie prostej aplikacji internetowej opartej o język PHP. Aplikacja ilustruje takie mechanizmy jak: obsługa formularzy oraz obsługa
Bardziej szczegółowoTworzenie witryn internetowych PHP/Java. (mgr inż. Marek Downar)
Tworzenie witryn internetowych PHP/Java (mgr inż. Marek Downar) Rodzaje zawartości Zawartość statyczna Treść statyczna (np. nagłówek, stopka) Layout, pliki multimedialne, obrazki, elementy typograficzne,
Bardziej szczegółowoAplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza na stronie WWW z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed
Bardziej szczegółowo