WYKŁAD 4 JĘZYK JAVASCRIPT CZĘŚĆ 1
|
|
- Lidia Kulesza
- 5 lat temu
- Przeglądów:
Transkrypt
1 WYKŁAD 4 JĘZYK JAVASCRIPT CZĘŚĆ 1
2 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. Umożliwia: manipulację wyglądem i położeniem elementów HTML; zmiany zawartości elementów HTML (innerhtml); pobieranie danych z formularzy i sprawdzanie ich poprawności; asynchroniczne ładowanie danych na stronę (Ajax);
3 CECHY JAVASCRIPT język skryptowy - nie musi być kompilowany do kodu maszynowego; ze względów bezpieczeństwa nie można zapisywać na dysku komputera, na którym przeglądana jest dana strona; wszelkie odwołania do funkcji i obiektów wykonywane są w trakcie wykonywania programu; pozwala na odciążenie serwerów i ograniczenie zbędnych danych, wysyłanych przez Internet; działa po stronie przeglądarki użytkownika.
4 ZAMIESZCZANIE KODU W HTML Kod JavaScript musi być zawarty pomiędzy znacznikami HTML a <script> i </script> Można go umieszczać w dowolnym miejscu dokumentu, ale o ile to tylko możliwe, umieszcza się go albo na początku strony w sekcji HEAD albo na końcu. w części <head> jeśli chcemy, żeby pliki załadowały się na początku pliki kluczowe dla działania strony; na końcu przed zamknięciem </body> jeśli chcemy, żeby pliki nie opóźniały ładowania elementów strony;
5 PRZYKŁAD <script type="text/javascript"> kod skryptu </script> <script type="text/javascript" src="nazwa_pliku.js"></script> <noscript>ta witryna wymaga obsługi skryptów.</noscript>
6 DOBRE PRAKTYKI JAVASCRIPT Dobrą praktyką jest: zamieszczanie kodu JavaScript w zewnętrznych plikach.js; zamieszczanie kodu JavaScript na końcu dokumentu; ładowanie asynchroniczne plików.js poprzez dodawanie atrybutu async do znacznika <script> o ile nie zakłóci to działania strony. <script async src= plik.js ></script> Zewnętrzne pliki są łatwiejsze do zarządzania, do tego poprzez umieszczenie ich w pamięci przeglądarki (cache) strony szybciej się ładują.
7 WYŚWIETLANIE INFORMACJI JavaScript nie posiada wbudowanych żadnych funkcji wyświetlających efekty działań. Można to osiągnąć na cztery sposoby wykorzystując: okno z komunikatem window.alert("cześć"), dokument HTML document.write("cześć"), element HTML innerhtml document.getelementbyid("demo").innerhtml = "to jest demo"; konsolę przeglądarki console.log("cześć").
8 WYŚWIETLANIE INFORMACJI Liczbę trzeba umieścić bezpośrednio w nawiasie okrągłym: document.write(1); Napis musi być ujęty w znaki cudzysłowu lub apostrofu: document.write("abc"); document.write('abc'); W jednej instrukcji można wyświetlić wiele oddzielnych liczb, tekstów i zmiennych łączenie odbywa się poprzez "+". document.write("abc " " def " + 3);
9 ZMIENNE var zmienna; var liczba =5; Zmienne tworzone są za pomocą słowa kluczowego var lub przypisanie wartości. Nazwa zmiennej może być dowolna, choć musi spełniać następujące zasady: musi zaczynać się od litery lub znaku podkreślenia, może zawierać jedynie litery, cyfry i znaki podkreślenia, nie może zawierać znaków narodowych (czyli dopuszczalne są jedynie znaki alfabetu łacińskiego), w nazwach rozróżniane są małe i duże litery.
10 JS I NOTACJA WIELBŁĄDZIA (CAMEL CASE) Podczas tworzenia zmiennych programiści wykorzystują różne sposoby na łączenie kilku słów w jedną nazwę zmiennej: Łączniki: first-name, last-name, master-card, inter-city; Podkreślenia: first_name, last_name, master_card, inter_city. Camel Case: FirstName, LastName, MasterCard, InterCity. W JavaScript najpopularniejsza jest notacja wielbłądzia z pierwszą literą małą: Camel Case: firstname, lastname, mastercard, intercity. Łączniki nie są dozwolone w JavaScript interpretuje je jako operację odejmowania.
11 TYPY DANYCH var length = 16; // Number var lastname = "Johnson"; // String var cars = ["Saab", "Volvo", "BMW"]; // Array var x = {firstname:"john", lastname:"doe"}; // Object Typy danych są ważne z punktu widzenia programowania bez typów danych komputer nie wiedziałby, jakie operacje może wykonać. var x = "Volvo"; // 20Volvo var x = "Volvo" ; // Volvo164
12 FUNKCJE JAVASCRIPT Funkcja to blok kodu wywoływany na stronie: Przez zdarzenie (np. kliknięcie przycisku); Przez inną funkcję; Automatycznie (tzw. self invoked) function nazwafunkcji(arg1, arg2) { var x = arg1*arg2; } var x = nazwafunkcji(2, 5);
13 RETURN W FUNKCJACH Wewnątrz funkcji argumenty zachowują się jak zmienne lokalne, tzn. ich zmiany nie wpływają na kod poza funkcją. Return pozwala na przekazanie wyniku działania w funkcji na zewnątrz. function nazwafunkcji(arg1, arg2) { } var x = arg1*arg2; return x; var x = nazwafunkcji(2, 5);
14 OBIEKTY JAVASCRIPT Obiekt najłatwiej sobie można wyobrazić jako "pojemnik", wewnątrz którego umieszczone są zmienne (właściwości) i funkcje (metody). Obiektem może być kot. Kot będzie miał między innymi takie właściwości, jak: cat.age, cat.breed, cat.color oraz takie metody jak: cat.crazymode() i cat.purrmode() Wszystkie koty mają te same właściwości, ale różne wartości tych właściwości. Podobnie jest z metodami wszystkie koty je mają, jednak wywołują je w różnych momentach.
15 PRZYKŁAD OBIEKTU var cat = { age: 7, breed: "NFO", color: "black", crazymode: function() { window.alert("au! It s crazy cat! "); }, purrmode: function() { window.alert("oh, what a kitty!"); } }; cat.crazymode();
16 ZDARZENIA Zdarzenia w HTML to rzeczy, które przydarzają się elementom HTML lub dokumentowi. To na przykład przesunięcie kursora myszy, kliknięcie, załadowanie strony, opuszczenie strony itp. Każdy element strony ma przypisany zestaw obsługiwanych przez niego zdarzeń, a każdemu z nich można przypisywać własne procedury obsługi, napisane w JavaScript.
17 ZDARZENIA Obsługę danego zdarzenia można przypisać na dwa sposoby. 1. Jeśli jest bardzo krótka i może być zapisana w jednej linii kodu, można ją przypisać bezpośrednio do znacznika obsługującego dane zdarzenie nie zalecane: <znacznik zdarzenie="instrukcja;"> 2. W przypadku dłuższych procedur zdarzeniu należy przypisać jedynie wywołanie funkcji JavaScript: <znacznik zdarzenie="nazwafunkcji();"> <p onclick="nazwafunkcji();">
18 LISTA TYPOWYCH ZDARZEŃ (więcej: onfocus - kiedy element otrzymuje fokus; onblur - kiedy element traci fokus; onchange - kiedy element traci focus i zmienia się wartość; onclick - kiedy element został kliknięty; onmouseover - kiedy kursor myszy wejdzie w obszar elementu; onmouseout - kiedy kursor myszy opuści obszar elementu; onselect - podczas zaznaczania fragmentu tekstu; onsubmit - podczas wysyłania formularza; onload - kiedy przeglądarka zakończy ładowanie strony lub ramki; onunload - kiedy przeglądarka usuwa bieżący dokument.
19 MODEL DOM Model DOM (z ang. Document Object Model) czyli obiektowy model dokumentu pozwala na odwoływanie się do elementów witryny oraz ich zmienianie, dodawanie i usuwanie. HTML DOM definiuje: Elementy HTML jako obiekty; Właściwości wszystkich elementów HTML; Metody elementów HTML; Zdarzenia dla elementów HTML.
20 SCHEMAT DOM DOM jest modelem hierarchicznym i udostępnia zestaw obiektów odzwierciedlających dokument HTML oraz elementy okna przeglądarki. Jest to struktura drzewiasta, w której elementy niższego poziomu są węzłami elementów wyższego poziomu.
21 SCHEMAT DOM
22 SCHEMAT DOM Głównym, globalnym obiektem DOM przeglądarki jest window. W tym obiekcie przechowywane są wszystkie globalne zmienne i funkcje. W nim jest także obiekt document, który reprezentuje całą stronę www. W oparciu o DOM JavaScript może: Dodawać, zmieniać i usuwać wszystkie elementy HTML i ich atrybuty na stronie; Zmieniać wszystkie style i klasy CSS na stronie; Dodawać i reagować na wszystkie zdarzenia HTML na stronie;
23 PORUSZANIE PO DOM HTML Wszystkie elementy HTML na stronie są zawarte w obiekcie document drzewa DOM HTML i tworzą tzw. kolekcje elementów. Kolekcje elementów - tablice zawierające informacje o wszystkich elementach danego typu. Np.: kolekcja forms zawiera w sobie wszystkie formularze i odwołujemy się do niej poprzez document.forms. Ilość elementów w kolekcji odczytuje się za pomocą właściwości lenght var formscounter = document.forms.length;
24 PORUSZANIE PO DOM HTML Kolekcja document.forms zawiera wszystkie formularze na stronie. Jeśli formularz ma atrybut name, to można go wybrać po nazwie w kolekcji document.forms. <form name="form1"></form> <form name="form2"></form> Do pierwszego z formularzy można się odwołać poprzez instrukcje: document.forms["form1"] document.forms.form1 document.forms[0]
25 PORUSZANIE PO DOM HTML Wewnątrz obiektu formularza można odwoływać się do jego kontrolek po nazwach za pośrednictwem kolekcji elements lub bezpośrednio po nazwie: <input type= text name= elname > document.forms[0].texts['elname'] document.forms[0].elname Żeby nie powtarzać w kółko document.forms... można sobie przypisać obiekt formularza do zmiennej tymczasowej: var f = document.forms[0]; f.elname.value= Agnieszka ;
26 PODSTAWOWE METODY I WŁASNOŚCI Metoda getelementbyid(id) Jeśli element ma identyfikator, to można go znaleźć za pomocą getelementbyid(id). Jest to najczęściej używany sposób dostępu do elementu. Własność innerhtml Najprostszy sposób na pobranie lub zastąpienie zawartości elementu. document.getelementbyid("demo").innerhtml = "Hello World!"; Własność innerhtml może być użyta do każdego elementu HTML, także <html> i <body>.
27 ODNAJDYWANIE ELEMENTÓW HTML document.getelementbyid(id) wykorzystuje element ID PRZED: <p id= demo > </p> // <p class= full >Akapit</p> // Akapit <script> document.getelementbyid( demo ).innerhtml= Lepszy akapit ; </script> PO: <p id= demo > </p> // Lepszy akapit <p class= full >Akapit</p> // Akapit
28 ODNAJDYWANIE ELEMENTÓW HTML document.getelementsbytagname(name) - wykorzystuje znacznik; PRZED: <p id= demo > </p> // Lepszy akapit <p class= full >Akapit</p> // Akapit <script> document.getelementbytagname( p ).innerhtml= Zwykły akapit ; </script> PO: <p id= demo > </p> // Zwykły akapit <p class= full >Akapit</p> // Zwykły akapit
29 ODNAJDYWANIE ELEMENTÓW HTML document.getelementsbyclassname(name) wykorzystuje klasę; PRZED: <p id= demo > </p> // Lepszy akapit <p class= full >Akapit</p> // Akapit <script> document.getelementbyclassname( full ).innerhtml= Jestem najlepszy! ; </script> PO: <p id= demo > </p> // Zwykły akapit <p class= full >Akapit</p> // Jestem najlepszy!
30 ZMIANA ELEMENTÓW HTML element.innerhtml zmienia zawartość elementu HTML; element.attribute - zmienia wartość atrybutu elementu HTML; document.getelementbyid( demo ).value= Brukselka ; document.getelementbyid( demo ).classname= title ; element.setattribute(attribute, value) - zmienia wartość atrybutu elementu HTML; element.style.property zmienia styl elementu HTML; document.getelementbyid( demo ).style.width= 200px ; document.getelementbyid( demo ).style.bordercolor = #ff0000 ;
31 ZMIANA ELEMENTÓW HTML element.style.property oraz element.classname Dzięki możliwości modyfikowania stylu danego elementu możliwe jest uzyskanie ciekawych efektów: Ukrywanie elementów: element.style.display = 'none' Zmiana pozycji elementów: element.style.left = x + 'px'; Przy używaniu nazw styli wykorzystuje się również notację wielbłądzią (camel case). background-color = backgroundcolor float = cssfloat Zaleca się jednak wykorzystywanie własności classname, w celu oddzielenia kodu JavaScript od wyglądu strony.
32 DZIĘKUJĘ ZA UWAGĘ MATERIAŁY POMOCNICZE
Zdarzenia 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ół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ółowoOgólny schemat prostego formularza: A może lepiej zamiast przycisku opartego o input tak:
Ogólny schemat prostego formularza: A może lepiej zamiast przycisku opartego o input tak: accept - typy zawartości MIME akceptowane przez serwer (opcjonalny) accept-charset - zestaw znaków akceptowanych
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ół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ół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ółowoFunkcje i instrukcje języka JavaScript
Funkcje i instrukcje języka JavaScript 1. Cele lekcji a) Wiadomości Uczeń : zna operatory i typy danych języka JavaScript, zna konstrukcję definicji funkcji, zna pętlę If i For, Do i While oraz podaje
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ół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ół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ł 6 JavaScript w przeglądarce Agenda Skrypty na stronie internetowej Model DOM AJAX Skrypty na stronie
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ół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ół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ół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ół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ółowoJavaScript. mgr inż. Remigiusz Pokrzywiński
JavaScript mgr inż. Remigiusz Pokrzywiński Czym jest JavaScript JavaScript to skryptowy język umożliwiający rozbudowę dokumentów HTML o możliwość interakcji z użytkownikiem oraz sprawdzania poprawności
Bardziej szczegółowoJAVASCRIPT (cz. IV) ĆWICZENIA DO SAMODZIELNEGO WYKONANIA materiały dydaktyczne dla słuchaczy opracowanie: 2004-2007 by Arkadiusz Gawełek, Łódź
JAVASCRIPT (cz. IV) ĆWICZENIA DO SAMODZIELNEGO WYKONANIA Ćwiczenie 1 obliczanie daty Wielkanocy Napisz skrypt, który: poprosi użytkownika o podanie roku z przedziału 1900..2099 sprawdzi, czy podana wartość
Bardziej szczegółowoTechniki WWW. (HTML, CSS, JavaScript) Dr inż. Marcin Zieliński WYKŁAD 6. Środa 15:30-17:00 sala: A-1-04
Techniki WWW (HTML, CSS, JavaScript) Dr inż. Marcin Zieliński WYKŁAD 6 Środa 15:30-17:00 sala: A-1-04 Wykład dla kierunku: Informatyka Stosowana II rok Rok akademicki: 2016/2017 - semestr zimowy Przypomnienie
Bardziej szczegółowoLaboratorium Wstawianie skryptu na stroną: 2. Komentarze: 3. Deklaracja zmiennych
1. Wstawianie skryptu na stroną: Laboratorium 1 Do umieszczenia skryptów na stronie służy znacznik: //dla HTML5 ...instrukcje skryptu //dla HTML4 ...instrukcje
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ół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ółowoTest przykładowy 2 PAI WSB Wrocław /06/2018
Imię i Nazwisko: Student ID: Part 1: (Prawda lub Fałsz (T lub F)) 15. Która z poniższych deklaracji funkcji jest nieprawidłowa: A. function Sum(a, b, c){; B. function Sum(var a, var b); C. function Sum(a){;
Bardziej szczegółowoJAVAScript w dokumentach HTML - przypomnienie
Programowanie obiektowe ćw.1 JAVAScript w dokumentach HTML - przypomnienie JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania. Skrypty JavaScript są zagnieżdżane w
Bardziej szczegółowoWprowadzenie do języka JavaScript
Wprowadzenie do języka JavaScript Ogólny schemat prostego formularza: A może lepiej zamiast przycisku opartego o input tak: accept - typy zawartości MIME akceptowane przez serwer (opcjonalny) accept-charset
Bardziej szczegółowoJAVASCRIPT PODSTAWY. opracowanie: by Arkadiusz Gawełek, Łódź
JAVASCRIPT PODSTAWY materiały dydaktyczne dla uczniów słuchaczy opracowanie: 2004-2007 by Arkadiusz Gawełek, Łódź 1. Czym jest JavaScript JavaScript tak naprawdę narodził się w firmie Netscape jako LiveScript,
Bardziej szczegółowoCSS. Kaskadowe Arkusze Stylów
CSS Kaskadowe Arkusze Stylów CSS CSS = Cascading Style Sheets Style określają sposób wyświetlania zawartości elementów HTML Arkusz stylów jest zbiorem takich reguł Pojawiły się w HTML 4.0 by rozwiązać
Bardziej szczegółowoRys.2.1. Trzy warstwy stanowiące podstawę popularnego podejścia w zakresie budowy stron internetowych [2]
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 JavaScript tak
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ół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ół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ółowoKurs HTML 4.01 TI 312[01]
TI 312[01] Spis treści 1. Wiadomości ogólne... 3 2. Wersje języka HTML... 3 3. Minimalna struktura dokumentu... 3 4. Deklaracje DOCTYPE... 3 5. Lista znaczników, atrybutów i zdarzeń... 4 5.1 Lista atrybutów
Bardziej szczegółowoCw.12 JAVAScript w dokumentach HTML
Cw.12 JAVAScript w dokumentach HTML Wstawienie skryptu do dokumentu HTML JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania.skrypty Java- Script mogą być zagnieżdżane
Bardziej szczegółowoJAVAScript w dokumentach HTML (1)
JAVAScript w dokumentach HTML (1) JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania. Skrypty JavaScript mogą być zagnieżdżane w dokumentach HTML. Instrukcje JavaScript
Bardziej szczegółowoCelem ćwiczenia jest zapoznanie z językiem HTML i JavaScript, zasadami tworzenia stron WWW i umieszczania na nich skryptów w języku JavaScript.
Instrukcja laboratoryjna do ćwiczenia: 1. Cel ćwiczenia Strona internetowa w systemach unix-owych Celem ćwiczenia jest zapoznanie z językiem HTML i JavaScript, zasadami tworzenia stron WWW i umieszczania
Bardziej szczegółowoJAVAScript w dokumentach HTML (2)
Informatyka ćw.6 JAVAScript w dokumentach HTML (2) Interakcyjne wprowadzanie danych Jednym ze sposobów jest stosowanie metody prompt dla wbudowanego obiektu window: zmienna= prompt("tekst zachęty, np.
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ół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ół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ółowoObiektowy PHP. Czym jest obiekt? Definicja klasy. Składowe klasy pola i metody
Obiektowy PHP Czym jest obiekt? W programowaniu obiektem można nazwać każdy abstrakcyjny byt, który programista utworzy w pamięci komputera. Jeszcze bardziej upraszczając to zagadnienie, można powiedzieć,
Bardziej szczegółowoza pomocą: definiujemy:
HTML CSS za pomocą: języka HTML arkusza CSS definiujemy: szkielet strony wygląd strony Struktura dokumentu html - znaczniki Znaczniki wyznaczają rodzaj zawartości. element strony
Bardziej szczegółowoPolitechnika Poznańska Wydział Budowy Maszyn i Zarządzania
1) Cel ćwiczenia Celem ćwiczenia jest zapoznanie się z podstawowymi elementami obiektowymi systemu Windows wykorzystując Visual Studio 2008 takimi jak: przyciski, pola tekstowe, okna pobierania danych
Bardziej szczegółowoPozycjonowanie i poruszanie warstw
Pozycja warstwy na ekranie może być zmieniana poprzez modyfikację właściwości top i left obiektu style. Odpowiadają one za położenie lewego górnego rogu; pierwsza za współrzędną x, druga y. Umiejscowienie
Bardziej szczegółowoTworzenie aplikacji internetowych E14
Tworzenie aplikacji internetowych E14 JavaScript w przykładach Tomasz Fitzermann Język JavaScript JavaScript - język skryptowy rozszerzający standardowy HTML m.in. o możliwość interakcji z użytkownikiem
Bardziej szczegółowoSpis treści. Wprowadzenie 11 Rozdział 1. Pierwsze spotkanie z JavaScriptem 15. Spis treści
Spis treści Spis treści Wprowadzenie 11 Rozdział 1. Pierwsze spotkanie z JavaScriptem 15 Czym jest JavaScript?... 16 JavaScript to nie Java... 17 Skąd się wziął język JavaScript... 19 Co potrafi JavaScript...
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ół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ółowoJavaScript funkcyjność
JavaScript funkcyjność WWW 9 kwietnia 2014 Możliwości tworzenia dynamicznych stron WWW HTML i CSS. Skrypty CGI (Perl, PHP). Serwery (django, java). Plug-iny. Ksiażka Większość przykładów pochodzi z ksiażki:
Bardziej szczegółowoHTML ciąg dalszy. Listy, formularze
HTML ciąg dalszy Listy, formularze Listy Służą do prezentacji treści w postaci wypunktowania: numerowanego nienumerowanego definicji Możliwe jest zagnieżdżanie list zarówno tego samego, jak i różnych typów
Bardziej szczegółowoPo zakończeniu rozważań na temat World Wide Web, poznaniu zasad organizacji witryn WWW, przeczytaniu kilkudziesięciu stron i poznaniu wielu nowych
rk Po zakończeniu rozważań na temat World Wide Web, poznaniu zasad organizacji witryn WWW, przeczytaniu kilkudziesięciu stron i poznaniu wielu nowych pojęć, prawdopodobnie zastanawiasz się, kiedy zaczniesz
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ółowoMetody getter https://www.python-course.eu/python3_object_oriented_programming.php 0_class http://interactivepython.org/runestone/static/pythonds/index.html https://www.cs.auckland.ac.nz/compsci105s1c/lectures/
Bardziej szczegółowoProgramowanie w języku Python. Grażyna Koba
Programowanie w języku Python Grażyna Koba Kilka definicji Program komputerowy to ciąg instrukcji języka programowania, realizujący dany algorytm. Język programowania to zbiór określonych instrukcji i
Bardziej szczegółowoWykład 4 Praca z obrazami część I
SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Wykład 4 Praca z obrazami część I 1 SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Efekt rollover 2 I. Rollover
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ółowoProgramowanie obiektowe i zdarzeniowe wykład 4 Kompozycja, kolekcje, wiązanie danych
Programowanie obiektowe i zdarzeniowe wykład 4 Kompozycja, kolekcje, wiązanie danych Obiekty reprezentują pewne pojęcia, przedmioty, elementy rzeczywistości. Obiekty udostępniają swoje usługi: metody operacje,
Bardziej szczegółowoSUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania. Wykład 3. dr Artur Bartoszewski - WYKŁAD: Języki i Systemy Programowania,
SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Wykład 3 1 SUM Edukacja Techniczno Informatyczna Języki i Systemy Programowania Przykład Bingo 2 Treść przykładu Jak wygląda karta do
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ółowoBudowa aplikacji ASP.NET współpracującej z bazą dany do obsługi przesyłania wiadomości
Budowa aplikacji ASP.NET współpracującej z bazą dany do obsługi przesyłania wiadomości część 2 Zaprojektowaliśmy stronę dodaj_dzial.aspx proszę jednak spróbować dodać nowy dział nie podając jego nazwy
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ółowoJĘZYKI PROGRAMOWANIA Z PROGRAMOWANIEM OBIEKTOWYM. Wykład 6
JĘZYKI PROGRAMOWANIA Z PROGRAMOWANIEM OBIEKTOWYM Wykład 6 1 SPECYFIKATOR static Specyfikator static: Specyfikator ten powoduje, że zmienna lokalna definiowana w obrębie danej funkcji nie jest niszczona
Bardziej szczegółowoPrzekształcenie danych przestrzennych w interaktywne mapy dostępne na stronach www (WARSZTATY, poziom zaawansowany)
Wrocławski Instytut Zastosowań Informacji Przestrzennej i Sztucznej Inteligencji Przekształcenie danych przestrzennych w interaktywne mapy dostępne na stronach www (WARSZTATY, poziom zaawansowany) Szkolenia
Bardziej szczegółowoProgramowanie w Ruby
Programowanie w Ruby Wykład 3 Marcin Młotkowski 22 października 2018 Plan wykładu 1 2 3 4 5 Marcin Młotkowski Programowanie w Ruby 70 / 432 Z poprzedniego wykładu String to ciąg bajtów zwykle reprezentujących
Bardziej szczegółowoProgramowanie dla początkujących w 24 godziny / Greg Perry, Dean Miller. Gliwice, cop Spis treści
Programowanie dla początkujących w 24 godziny / Greg Perry, Dean Miller. Gliwice, cop. 2017 Spis treści O autorach 11 Podziękowania 12 Wprowadzenie 13 CZĘŚĆ I ZACZNIJ PROGRAMOWAĆ JUŻ DZIŚ Godzina 1. Praktyczne
Bardziej szczegółowoHTML (HyperText Markup Language) hipertekstowy język znaczników
HTML (HyperText Markup Language) hipertekstowy język znaczników Struktura dokumentu tytuł strony
Bardziej szczegółowoWykład 8: klasy cz. 4
Programowanie obiektowe Wykład 8: klasy cz. 4 Dynamiczne tworzenie obiektów klas Składniki statyczne klas Konstruktor i destruktory c.d. 1 dr Artur Bartoszewski - Programowanie obiektowe, sem. 1I- WYKŁAD
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ół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ół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ółowoMateriały do laboratorium MS ACCESS BASIC
Materiały do laboratorium MS ACCESS BASIC Opracowała: Katarzyna Harężlak Access Basic jest językiem programowania wykorzystywanym w celu powiązania obiektów aplikacji w jeden spójny system. PROCEDURY I
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ółowoJAVASCRIPT PODSTAWY. opracowanie: by Arkadiusz Gawełek, Łódź
JAVASCRIPT PODSTAWY materiały dydaktyczne dla uczniów słuchaczy opracowanie: 2004-2007 by Arkadiusz Gawełek, Łódź 1. Czym jest JavaScript JavaScript tak naprawdę narodził się w firmie Netscape jako LiveScript,
Bardziej szczegółowoInformatyka I. Klasy i obiekty. Podstawy programowania obiektowego. dr inż. Andrzej Czerepicki. Politechnika Warszawska Wydział Transportu 2018
Informatyka I Klasy i obiekty. Podstawy programowania obiektowego dr inż. Andrzej Czerepicki Politechnika Warszawska Wydział Transportu 2018 Plan wykładu Pojęcie klasy Deklaracja klasy Pola i metody klasy
Bardziej szczegółowoPodstawy programowania skrót z wykładów:
Podstawy programowania skrót z wykładów: // komentarz jednowierszowy. /* */ komentarz wielowierszowy. # include dyrektywa preprocesora, załączająca biblioteki (pliki nagłówkowe). using namespace
Bardziej szczegółowoDodanie nowej formy do projektu polega na:
7 Tworzenie formy Forma jest podstawowym elementem dla tworzenia interfejsu użytkownika aplikacji systemu Windows. Umożliwia uruchomienie aplikacji, oraz komunikację z użytkownikiem aplikacji. W trakcie
Bardziej szczegółowoKurs WWW wykład 6. Paweł Rajba
Kurs WWW wykład 6 Paweł Rajba pawel@ii.uni.wroc.pl http://www.ii.uni.wroc.pl/~pawel/ Obiekt Window Zdarzenia onblur ondragdrop onerror onfocus onload onmove onresize onunload Obiekt Location Właściwości
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ółowoSpecyfikacja techniczna kreacji HTML5
Specyfikacja techniczna kreacji HTML5 www.gemius.pl Parametry przekazywane do kreacji Kreacje HTML osadzane są na stronie za pomocą znacznika . W adresie do pliku kreacji przekazywane są parametry
Bardziej szczegółowoLokalizacja jest to położenie geograficzne zajmowane przez aparat. Miejsce, w którym zainstalowane jest to urządzenie.
Lokalizacja Informacje ogólne Lokalizacja jest to położenie geograficzne zajmowane przez aparat. Miejsce, w którym zainstalowane jest to urządzenie. To pojęcie jest używane przez schematy szaf w celu tworzenia
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ółowoPython wprowadzenie. Warszawa, 24 marca PROGRAMOWANIE I SZKOLENIA
Python wprowadzenie Warszawa, 24 marca 2017 Python to język: nowoczesny łatwy w użyciu silny można pisać aplikacje Obiektowy klejący może być zintegrowany z innymi językami np. C, C++, Java działający
Bardziej szczegółowoMETODY I JĘZYKI PROGRAMOWANIA PROGRAMOWANIE STRUKTURALNE. Wykład 02
METODY I JĘZYKI PROGRAMOWANIA PROGRAMOWANIE STRUKTURALNE Wykład 02 NAJPROSTSZY PROGRAM /* (Prawie) najprostszy przykład programu w C */ /*==================*/ /* Między tymi znaczkami można pisać, co się
Bardziej szczegółowoProgramowanie obiektowe. Wykład 4
Programowanie obiektowe Wykład 4 Tworzenie własnych obiektów Słowo kluczowe this W JavaScriptmożna tworzyć własne obiekty. Wykorzystuje się tu zapis utworzonej funkcji o nazwie takiej samej jak klasa,
Bardziej szczegółowoPodstawy Programowania 2
Podstawy Programowania 2 Laboratorium 7 Instrukcja 6 Object Pascal Opracował: mgr inż. Leszek Ciopiński Wstęp: Programowanie obiektowe a programowanie strukturalne. W programowaniu strukturalnym, któremu
Bardziej szczegółowoKaskadowe arkusze stylów (CSS)
Kaskadowe arkusze stylów (CSS) CSS (Cascading Style Sheets) jest to język opisujący sposób, w jaki przeglądarki mają wyświetlać zawartość odpowiednich elementów HTML. Kaskadowe arkusze stylów służą do
Bardziej szczegółowoJavaScript. Wstęp do podstaw elementów. dr inż. Paweł Boiński, Politechnika Poznańska
JavaScript Wstęp do podstaw elementów dr inż. Paweł Boiński, Politechnika Poznańska Wprowadzenie Historia Maj 1995-10 dni, Mocha, Netscape Wrzesień 1995 - Mocha -> LiveScript Grudzień 1995 - LiveScript
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ółowoAplikacje mobilne. Pliki zasobów, grafiki, menu, podpinanie zdarzeń. dr Tomasz Jach Instytut Informatyki, Uniwersytet Śląski
Aplikacje mobilne Pliki zasobów, grafiki, menu, podpinanie zdarzeń dr Tomasz Jach Instytut Informatyki, Uniwersytet Śląski Pliki zasobów Jak już robiliśmy wcześniej sporo rzeczy w Androidzie umieszczamy
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ółowoAplikacje Internetowe
Aplikacje Internetowe ITA-103 Wersja 1 Warszawa, październik 2008 Spis treści Wprowadzenie i-4 Moduł 1 Podstawy HTML 1-1 Moduł 2 Kaskadowe Arkusze Stylów CSS 2-1 Moduł 3 Podstawy JavaScript 3-1 Moduł 4
Bardziej szczegółowoPodstawy programowania. Wykład Funkcje. Krzysztof Banaś Podstawy programowania 1
Podstawy programowania. Wykład Funkcje Krzysztof Banaś Podstawy programowania 1 Programowanie proceduralne Pojęcie procedury (funkcji) programowanie proceduralne realizacja określonego zadania specyfikacja
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ółowoOczywiście plik musi mieć rozszerzenie *.php
Oczywiście plik musi mieć rozszerzenie *.php Znaczniki PHP komunikują serwerowi gdzie rozpoczyna się i kończy kod PHP. Tekst między nimi jest interpretowany jako kod PHP, natomiast poza nimi jako kod HTML.
Bardziej szczegółowoWykład 5: Klasy cz. 3
Programowanie obiektowe Wykład 5: cz. 3 1 dr Artur Bartoszewski - Programowanie obiektowe, sem. 1I- WYKŁAD - podstawy Konstruktor i destruktor (część I) 2 Konstruktor i destruktor KONSTRUKTOR Dla przykładu
Bardziej szczegółowoWitryny i aplikacje internetowe
Program nauczania Witryny i aplikacje internetowe technik informatyk 351203 Treści nauczania Lp. Temat Liczba Efekty kształcenia godzin 1. HTML hipertekstowy język znaczników 30 1. Składnia języka HTML
Bardziej szczegółowoEGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2018 CZĘŚĆ PRAKTYCZNA
Arkusz zawiera informacje prawnie chronione do momentu rozpoczęcia egzaminu Układ graficzny CKE 2018 Nazwa kwalifikacji: Tworzenie aplikacji internetowych i baz danych oraz administrowanie bazami Oznaczenie
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ółowoProgramowanie internetowe
Programowanie internetowe Wykład 3 wprowadzenie do PHP mgr inż. Michał Wojtera email: mwojtera@dmcs.pl Formularze i ich używanie
Bardziej szczegółowo