HTTP

1.Wymień najważniejsze metody (rodzaje żądań) HTTP. Pytanie do serwera: request, i odpowiedz: response

2. Co to znaczy, że protokół HTTP jest bezstanowy?

Bezstanowy - nie zachowuje żadnych informacji o zrealizowanej transakcji; Stanowość zapewnia najczęściej mechanizm sesji kontrolowanej przez serwer, do czego wykorzystuje się mechanizm ciasteczek (cookies) zapisywanych przez klienta
3. Na czym polega różnica między metodami (rodzajami żądań) GET oraz HEAD protokołu HTTP.

GET - pobranie wskazanego przez URI zasobu; najczęściej wykorzystywany

HEAD - pobranie informacji o wskazanym zasobie serwer na oba żadania musi obowiązkowo odpowiadać
4. Na czym polega różnica między metodami (rodzajami żądań) GET oraz POST protokołu HTTP.

GET - pobranie wskazanego przez URI zasobu; najczęściej wykorzystywany

POST- przesłanie danych od klienta do serwera, np. danych formularza; dane przekazywane są do wskazanego zasobu, tj. skryptu CGI, PHP, …
Na POST serwer odpowiada w przypadku jeżeli aktywny jest mechanizm dynamicznego

tworzenia stron WWW
5. Jakie były najważniejsze przejawy i skutki tzw. pierwszej wojny przeglądarek?
*Pierwsza wojna przeglądarek: 1997-1999 MS Internet Explorer vs Netscape Nawigator Niestandardowe rozszerzenia ("fajniejsze" strony WWW); początkowo wygrywa NN, przeważa fakt, że IE jest darmowy Efekt: całkowita dominacja IE, zastój w rozwoju przeglądarek i standardów HTML
6. Kim były strony tzw. pierwszej wojny przeglądarek? Kto i dlaczego tę wojnę wygrał?
Niestandardowe rozszerzenia ("fajniejsze" strony WWW); początkowo wygrywa NN, przeważa fakt, że IE jest darmowy Efekt: całkowita dominacja IE, zastój w rozwoju przeglądarek i standardów HTML
7. Jaki wpływ na rozwój języka HTML oraz CSS miały wojny przeglądarek, pierwsza i druga?
*Druga wojna przeglądarek: 2002-? MS Internet Explorer vs (Firefox + Safari + Opera) Zgodność ze standardami i likwidacja monopoli; paradoksalnie, IE przeważa ponieważ nie respektuje standardów W3C

HTML

1. Do czego służy język HTML i jakie możliwości daje twórcom stron WWW?

HTML (ang. Hypertext Markup Language)

język znaczników hipertekstowych - obecnie dominujący

język stron internetowych.

• Opisuje strukturę informacji zawartych w dokumencie

(nagłówki, akapity listy, tabele, …)

• Umożliwia określenie sposobu prezentacji poszczególnych

elementów dokumentu

(wyrównanie, obramowanie, odstępy, czcionka, kolor, …)

• Umożliwia osadzanie w dokumencie dodatkowych elementów

(grafika, animacje, aplety, formularze, …)

• Umożliwia osadzanie w dokumencie skryptów, wpływających na

zachowanie przeglądarki

(JavaScript, VB Script, …)

2. Co oznacza określenie "strukturalny HTML"?

Cały dokument reprezentowany jest przez jeden element

(html), składający się z nagłówka (head) i ciała (body).

Można pominąć typ dokumentu a nawet nagłówek, jednak

nie jest to zalecane.

3. Jaka jest relacja między językami SGML i HTML?

HTML wywodzi się z języka SGML (ang. Standard Generalized

Markup Language).

4. Jakie są najważniejsze różnice między językami HTML i XHTML?

XHTML (ang. Extensible Hypertext Markup Language)

rozszerzalny język znaczników hipertekstowych - uważany za

następcę języka HTML, intensywnie promowany.

• Oparty na XML (zamiast SGML);

• Obsługa przestrzeni nazw XML

- możliwość stosowania rozszerzeń (np. SVG, MathML, …)

• Bardziej restrykcyjne reguły

- obowiązkowe znaczniki zamykające

- rozróżniane małe i wielkie litery

Łatwiejsza walidacja dokumentów (ale nie weryfikacja)

• Inny typ MIME zawartości

application/xhtml+xml zamiast text/html

5. Z jakich najważniejszych części składa się dokument HTML?

składający się z nagłówka (head) i ciała (body)

6. Do czego służy DTD w dokumencie HTML? W jaki sposób brak DTD wpływa na działanie przeglądarki?

Określenie typu dokumentu (DTD, document type

declaration) informuje przeglądarkę o tym, który z wariantów

języka html/xhtml jest używany.

• Determinuje to sposób interpretacji dokumentu.

• Jeżeli DTD nie zostanie podany (lub zawiera błędy),

przeglądarka pracuje w trybie kompatybilności (tzw. tryb quirks,

tryb dziwactw, pozwalający w miarę prawidłowy sposób

prezentacji starych dokumentów HTML);

przeglądarka może ignorować niektóre znaczniki lub atrybuty

znaczników bądź interpretować je niestandardowo, ale też

może uwzględniać znaczniki i atrybuty obecnie nieużywane.

7. Jakie informacje są umieszczane w elemencie <head> dokumentu HTML?

Najważniejsze elementy nagłówka:

• Sposób kodowania znaków i język dokumentu

• Autor, tytuł oraz ikona strony

• Słowa kluczowe, opis zawartości

• Data utworzenia, modyfikacji, ważności

• Generator stron

W nagłówku można dołączyć lub osadzić arkusz stylów (CSS)

oraz dołączyć lub osadzić skrypt (JavaScript, VBScript)

8. Jaki wpływ ma zawartość elementu <head> dokumentu HTML na działanie wyszukiwarek internetowych?

Formalnie nieobowiązkowy, jednak zawarte w nim informacje

maja istotne znaczenie zarówno dla przeglądarki oraz

poprawnego wyświetlania strony, jak i dla wyszukiwarek.

9. Jakie są popularne standardy kodowanie polskich znaków w dokumentach HTML? Które z nich są formalnie poprawne?

Istnieje kilka metod kodowania polskich znaków. Jedyne

poprawne to ISO 8859-2 (tzw. latin 2) oraz Unicode, w tym

popularny UTF-8. Sposób znany z Windows (CP1250) nie jest

uznanym standardem międzynarodowym

10. Scharakteryzuj atrybuty elementów HTML: id oraz name.

id - identyfikator (nazwa) elementu; powinien być unikalny w

obrębie dokumentu; może być wykorzystany w skryptach oraz

arkuszach stylów

name - Atrybut definiuje nazwę elementu. Nazwa umożliwia komunikowanie się z tym elementem przez inne elementy używając np. skryptów lub appletów. Identyfikacja pomaga w precyzyjnym określeniu jednego elementu lub całej grupy elementów np. dla pól wyboru w formularzach.

11. Scharakteryzuj atrybuty elementów HTML: class oraz style.

class - przypisuje elementowi nazwę lub nazwy klas arkusza

stylów, do których element zostaje przypisany

style - styl elementu, nadpisujący styl odziedziczony

12. Scharakteryzuj elementy <h1> ... <h6> HTML.

Elementy strukturalne blokowe - naglowki

13. Scharakteryzuj elementy <ol>, <ul> oraz <li> HTML.

Elementy strukturalne blokowe - listy

Ol - Lista uporządkowanych (numerowanych) elementów;

Ul - Lista nieuporządkowanych (wypunktowanych) elementów;

Li - Element listy numerowanej lub wypunktowanej: li

• Zawartość list ol oraz ul mogą stanowić wyłącznie elementy list,

definiowane jako li

14. Podaj przykłady elementów strukturalnych blokowych i liniowych HTML. Na czym polega różnica między nimi?

Elementy formatowania tekstu - liniowe

• b - wytłuszczenie (bold)

• i - kursywa (italic)

Elementy strukturalne blokowe - listy ul ol, naglowki

15. Do czego (do jakich zasobów) może odsyłać element <a> języka HTML?

element łącza hipertekstowego;

Odsyłacz do dokumentu HTML lub innych zasobów bądź usług

dostępnych w sieci Internet

16. Z jakich elementów HTML składa się (w najprostszym przypadku) tabela?

• tr - wiersz tabeli; powinien zawierać przynajmniej jedną

komórkę - th albo td

• th - komórka nagłówkowa (przeglądarki wyróżniają komórki

nagłówkowe, zazwyczaj przez wytłuszczenie tekstu)

• td - komórka danych

CSS

1. Do czego służą arkusze CSS? Jaki jest cel wprowadzenia arkuszy CSS do dokumentów HTML?

Kaskadowe Arkusze Stylów CSS (ang. Cascading Style Sheets) to język służący do formatowania dokumentów WWW, utworzonych w językach HTML oraz XHTML. CSS stworzono w celu odseparowania formy prezentacji

dokumentu (CSS) od jego struktury i zawartości (HTML)
2. Jakie są zalety stosowania arkuszy CSS w porównaniu do formatowania dokumentów WWW poprzez atrybuty elementów HTML? Arkusz CSS składa się z listy dyrektyw (reguł) określających sposób prezentacji określonej cechy określonego elementu

HTML/XHTML (np. kolor czcionki nagłówka poziomu 3,

szerokość lewego wewnętrznego marginesu elementu listy, …)

3. Na czym polega kaskada stylów, wymieniana w nazwie arkuszy CSS?
Kaskada stylów polega na możliwości definiowania stylu w kilku

miejscach i określeniu priorytetów poszczególnych arkuszy

(na wypadek gdyby reguły były sprzeczne)
4. Jakie są metody dołączania stylów do poszczególnych elementów HTML (tj. w jakich miejscach dokumentu można to zrobić i w jaki sposób) ? Metody dołączania stylów:

• Element link w nagłówku HTML:

<link rel="stylesheet" type="text/css"

href="style.css">

• Element style w nagłówku HTML:

<style type="text/css">

<!--

-->

</style>

• Atrybut style elementu HTML

<??? style=" … ">

5. Wyjaśnij różnicę pomiędzy układami selektorów CSS: "div, p" element div oraz p, "div p” element p zawarty w div oraz "div > p" element p zawarty bezpośrednio w div .
6. Podaj interpretację układu selektorów CSS: h2 + ol.contens li element ol.contents li umieszczony bezpośrednio za h2, gdzie li zawarty jest w ol.contents
7. Podaj interpretację układu selektorów CSS: div h3 + p.comment Element h3 zawarty w elemencie div, gdzie p.comment umieszczony bezpośrednio za h3
8. Do czego odnoszą się selektory CSS: p.index oraz p#index? Na czym polega różnica między zakresami ich stosowania? Różnica polega na tym że kropka . określa wielokrotność występowania w dokumencie Html, a # że element jest unikalny
9. Do czego odnoszą się selektory CSS: a:link łacze jeszcze nie odwiedzone, a:hover element (łącze) wskazany, ale nie aktywowany oraz a:visited łącze odwiedzone.
10. Co to znaczy, że styl CSS może być przypisany do medium? Jakie rodzaje mediów zdefiniowane w CSS? • all - wszystkie media (wartość domyślna)

• screen - ekran komputera

• print - drukarka

• projection - rzutnik (projektor)

• handheld - urządzenia przenośne (mały ekran i przepustowość)

• tv - ekran o małej rozdzielczości, bez przewijania

• speech - syntezator mowy

• braille - urządzenia z pismem Brailla
11. Jakie atrybuty czcionki można formatować za pomocą CSS?

-font-family: rodzaj, rodzaj, rodzaj-ogólny

- font-size: wielkość [em, pt, px, %] | small | medium| large

- line-height: wielkość [em, pt, px, %]

- font-style: normal | italic

- font-weight: normal | bold | liczba

100, 200, 300, 400=normal, 500, 600, 700=bold, 800, 900

- font-variant: normal | smallcaps

p { font-family: Arial, sans-serif; }

h1 { font-size: 150% }

Łączone cechy czcionki:

- font: [font-style font-variant font-weight]

font-size [/line-height] font-family

body { font: bold italic 12pt/15pt serif }

12. Jakie atrybuty tekstu można formatować za pomocą CSS? - color: RGB

- text-decoration: none | underline | line-through |overline

- text-transform: none | capitalize | uppercase | lowercase

- text-align: left | right | center | justify

- text-indent: wielkość-

- line-height: wielkość

- word-spacing: normal | wielkość

- letter-spacing: normal | wielkość

p { color: teal; }

p.warning {text-transform: capitalize }

a { text-decoration: none; }

h1 { letter-spacing: 0.25em }

PHP

1.Na czym polega różnica między statycznymi a dynamicznymi stronami WWW?

Statyczne strony internetowe charakteryzują się zdefiniowaną „na sztywno” strukturą, której zmiana wymaga ingerencji webmastera. Podstawowe strony www zawierają do kilku podstron, na których zawarte są kluczowe informacje.

Dynamiczne strony www są oparte na systemie zarządzania treścią CMS z wykorzystaniem bazy danych (MySQL), który pozwala odbiorcy na samodzielne wykonanie aktualizacji strony czyli dodaniu nowych produktów do oferty, zdjęć, artykułów, informacji, nowości i wszystkiego czego sobie tylko życzy.

2.Wymień przykładowe zastosowania dynamicznych serwisów WWW.

Zastosowania:

• Portale informacyjne

zawartość informacyjna modyfikowana odrębnymi narzędziami, zapisywana w bazie danych,

• Sklepy internetowe

dostępne towary opisane w bazie danych, podobnie zamówienie złożone przez użytkownika,

• Bankowość internetowa

• Systemy nauczania na odległość

materiały dydaktyczne, testy zaliczeniowe, dane instruktorów oraz słuchaczy (w tym wyniki testów) zapisane w bazie danych

• Fora internetowe, serwisy społecznościowe, serwisy Wiki, …

• Systemy CMS (Content Management System)

3.W jakich sytuacjach można stosować serwisy statyczne WWW? Jakie zalety ma serwis statyczny w porównaniu z dynamicznym?

Zalety serwisów statycznych WWW:

- prostota rozwiązań związanych z implementacją

Wady dynamicznych serwisów WWW:

- dłuższy czas implementacji

- wymagają bazy danych na serwerze

(nie jestem pewny odpowiedzi na pytanie nr 3)

4.Jakie platformy programistyczne są najczęściej wykorzystywane do tworzenia dynamicznych serwisów WWW?

Platformy:

• Dedykowane serwery

Programy obsługujące komunikację TCP/IP na porcie 80 TCP, dowolny język (np. BCB, Delphi lub MS VS + pakiet InDy)

• Skrypty CGI (Common Gateway Interface)

skrypty (Perl, Python) lub programy (dowolny język)

• PHP

skrypty generujące HTML, z możliwością załączania HTML; wbudowane wsparcie HTTP i baz danych

• JSP (Java Server Pages), JSF (Java Server Faces)

znaczniki (nie HTML), przetwarzane przez JSP/JSF na HTML, środowisko RAD, automatyczne powiązania z kodem (zdarzenia)

• ASP.NET (Active Server Pages)

technologia MS, funkcjonalnie podobna do JSF; różne języki programowania (Visual Basic, C#, Java)

5.Wymień najważniejsze cechy języka PHP

• Język skryptowy - programy PHP nie są kompilowane do kodu binarnego, lecz interpretowane na bieżąco podczas wykonywania

• Działa po stronie serwera - skrypt PHP generuje dokument HTML, wyświetlany przez przeglądarkę - nie wymaga określonej przeglądarki, jej wersji lub wtyczek

• Język obiektowy, z potężnymi bibliotekami (w tym PEAR) oraz obsługą baz danych i dokumentów XML

• Opracowany specjalnie do tworzenia dynamicznych stron WWW - wbudowana obsługa HTTP (w tym odczyt i generowanie nagłówków, przekazywanie parametrów dla metod GET i POST, obsługa plików Cookie i sesji, …), możliwość osadzania HTML

6.Na czym polega różnica pomiędzy operatorami == oraz ===?

== równe

=== identyczne

7.Na czym polega różnica pomiędzy łańcuchami tekstowymi ograniczonymi cudzysłowami oraz apostrofami?

• Łańcuchy ograniczone cudzysłowami - interpreter wyłapuje nazwy zmiennych i zastępuje ich wartościami:

$s1 = "./images/reddot.png";

echo "<img src='$s1'>";

echo "<img src=\"$s1\">"; // " -> \"

Można też stosować tzw. notację złożoną:

echo "<img src={$s1}>";

Notacja taka może się przydać również gdy tuż za nazwą zmiennej nie występuje separator (np. spacja lub apostrof):

$s2 = "reddot";

echo "<img src='./images/{$s2}.png'>";

• Łańcuchy ograniczone apostrofami - nie da się włączyc wartości zmiennej:

$s = 100;

echo 'Val: {$x}'; // Val: {$x}

Niezależnie od sposobu rozwijania zmiennych (tj. $x albo {$x}),

PHP nie zastąpi nazwy zmiennej jej wartością.

8.Podaj składnię i przykład użycia instrukcji warunkowej if-else.

Składnia:

if (warunek)

instrukcja1

else

instrukcja2

Przykład:

if ($delta>=0)

echo "<p>nie ma pierwiastków rzeczywistych";

else

{

$x1 = …;

$x2 = …;

echo "<p>pierwiastki: $x1, $x2";

}

9.Podaj składnię i przykład użycia instrukcji iteracyjnej while.

• Składnia:

while (warunek)

instrukcja

Przykład:

$i=10;

while ($i>0)

{

echo "<p>{$i}";

$i--;

}

10.Podaj składnię i przykład użycia instrukcji iteracyjnej for.

Składnia:

for (inicjalizacja; warunek; inkrementacja)

instrukcja

Przykład:

for ($i=1; $i<=10; $i++)

echo "<p>{$i}";

11.Co oznacza pojęcie tablica asocjacyjna? Podaj przykład zapisu i odczytu elementu tablicy w PHP.

12.Podaj składnię i przykład użycia instrukcji iteracyjnej foreach.

Składnia:

foreach (tablica as [klucz => ] wartość)

instrukcja

Przykład:

foreach ($t as $k => $w)

echo "<p>klucz: {$k}, wartość: {$w}";

13.Do czego służy funkcja var_dump()? Podaj przykład użycia.

var_dump - drukuje (do HTML) typ i wartość zmiennej

Przykład:

$x = 7;

var_dump($x); // int 7

14.Do czego służy funkcja isset()? Podaj przykład użycia.

isset($x) - sprawdza, czy wskazana zmienna istnieje

Przykład:

$x = 7;

$e = isset($x); // TRUE

15.Do czego służy funkcja echo()? Podaj przykład użycia.

Wyświetla jeden lub więcej stringów

Przykład:

echo "Hello world!";

16.Na czym polega różnica pomiędzy funkcjami echo() oraz print()

print() działa bardzo podobnie jak echo(); zasadnicza różnica polega na tym , że print akceptuje tylko jeden argument.

Formularze

1.Z jakich elementów składa się (w najprostszym przypadku) formularz HTML?

Formularz : struktura formularza

<form>

|-- <???>

|-- <fieldset> zbiór pół

| |-- <legend> opis zbioru pół

| |-- <input> pole danych

|-- <fieldset> zbiór pół

|-- <legend> opis zbioru pół

|-- <input> pole danych

|-- <input type="submit"> przycisk

Wymagany jest jeden element blokowy (np. div, table, fieldset)

obejmujący całą zawartość formularza. Aby formularz można

było wysłać do serwera, niezbędny jest element typu submit.

Formularz powinien też zawierać pola danych, np. typu input.

2.Scharakteryzuj atrybuty action oraz method formularza HTML.

Formularz: atrybuty action i method

• action - formularze typowo są obsługiwane po stronie serwera,

dlatego w atrybucie action trzeba podać URL skryptu (lub

innego typu dynamicznej strony WWW), do którego zostanie

wysłany formularz;

• method - sposób wysłania formularza do serwera; formularz

może być wysłany przez HTTP przy pomocy żądania POST albo

GET - różnica polega na sposobie przekazywania parametrów:

- POST -w nagłówkach HTTP

- GET - w adresie WWW, zatem są widoczne dla użytkownika

(np. …/forum.php?login=admin;passwd=kernel21),

a także zapisywane w historii przeglądarki (bezpieczeństwo!)

Zalecane jest oczywiście stosowanie metody POST.

3.Scharakteryzuj elementy <fieldset> oraz <legend> formularzy HTML.

Zbiór pól: fieldset

• Reprezentuje zbiór powiązanych ze sobą elementów

formularza;

wyświetlany jako owalna ramka, z opcjonalnym podpisem w

postaci elementu legend:

<form>

<fieldset>

<legend>Tytuł</legend>

<input …>

</fieldset>

</form>

• Znacznik zamykający - obowiązkowy

• Atrybuty:

id, class, style, title,

Opis zbioru pól: legend

• Wyświetla opis dla elementu fieldset :

<fieldset>

<legend>Tytuł</legend>

…

</fieldset>

• Znacznik zamykający - obowiązkowy

• Atrybuty:

id, class, style, title,

accesskey - klawisz szybkiego dostępu (skrót klawiaturowy)

4.Wymień rodzaje kontrolek, jakie można umieszczać w formularzach HTML.

5.Scharakteryzuj atrybuty name oraz value kontrolek wykorzystywanych w formularzach HTML, np. dla <input type="checkbox" ...>

Pole danych: atrybuty name i value

• name - dla kontrolek, które wysyłają dane do serwera (text,

password, submit, checkbox, radio, file, hidden) - określa

nazwę, pod jaką zawartość kontrolki (value) zostanie wysłana.

Brak atrybutu name powoduje, że zawartość kontrolki w ogóle

nie jest wysłana;

• value - znaczenie zależne od typu kontrolki:

- text, password - wartość początkowa wyświetlana w kontrolce

(przywracana po kliknięciu przycisku reset)

- checkbox, radio - wartość wysłana o ile kontrolka jest

zaznaczona (prze braku value wysyłana jest wart. "on");

jeżeli kontrolka nie jest zaznaczona, nic nie jest wysyłane

- hidden - wartość niewidoczna, wysyłana do serwera

- submit, reset, button - opis wyświetlany na przycisku

6.Jaki jest związek atrybutu name kontrolek wykorzystywanych w formularzach ze skryptami PHP odczytującymi dane formularzy?

7.Scharakteryzuj element HTML <input>. Wymień rodzaje kontrolek, w które zmienia się <input> zależnie od atrybutu type.

8.Scharakteryzuj element <input type="text" ...> formularza HTML.

Pole edycyjne: input type="text"

• Jednolinijkowe pole edycyjne do wpisania tekstu:

<input type="text" name="t1"

value="tu wpisz…" size="25" maxlength="30" >

• Ważniejsze atrybuty:

id - identyfikator, kojarzący pole z etykietą,

name - nazwa, pod jaką zawartość będzie wysłana do serwera

value - początkowa wartość

size - rozmiar pola

maxlength - maksymalna długość wpisanego tekstu

• Etykieta - opcjonalnie

9.Scharakteryzuj element <input type="password" ...> formularza.

Pole edycyjne hasła: input type="password"

• Jednolinijkowe pole edycyjne do wpisania hasła:

<input type="password" name="p1"

size="25" maxlength="30" >

• Ważniejsze atrybuty:

id - identyfikator, kojarzący pole z etykietą,

name - nazwa, pod jaką zawartość będzie wysłana do serwera

size - rozmiar pola

maxlength - maksymalna długość wpisanego tekstu

• Etykieta - opcjonalnie

10.Scharakteryzuj element <input type="checkbox" ...> formularza.

Pole wyboru: input type="checkbox"

• Pole edycyjne opcji niezależnych od siebie:

<input type="checkbox" id="ch1" name="ch1"

value="1" checked >

<label for="ch1">Opis opcji 1</label>

<input type="checkbox" id="ch2" name="ch2"

value="1">

<label for="ch2">Opis opcji 2</label>

• Ważniejsze atrybuty:

id - identyfikator, kojarzący pole z etykietą,

name - nazwa, pod jaką zawartość będzie wysłana do serwera

value - wartość wysyłana, jeżeli pole jest zaznaczone

(domyślnie "on"; jeżeli nie zaznaczone, nic nie jest wysyłane)

checked - jeżeli wystąpi, pole jest zaznaczone

11.Scharakteryzuj element <input type="radio" ...> formularza.

Przycisk radiowy: input type="radio"

• Pole edycyjne opcji niezależnych od siebie:

<input type="radio" id="r1" name="rg1"

value="1" checked >

<label for="r1">Opis opcji 1</label>

<input type="radio" id="r2" name="rg1"

value="2">

<label for="r2">Opis opcji 2</label>

• Ważniejsze atrybuty:

id - identyfikator, kojarzący pole z etykietą,

name - nazwa, pod jaką zawartość będzie wysłana do serwera;

ważne! atrybut name dla grupy opcji musi być ten sam

value - wartość wysyłana, jeżeli pole jest zaznaczone

checked - jeżeli wystąpi, pole jest zaznaczone

12.Scharakteryzuj element <input type="submit" ...> formularza.

Przycisk submit: input type="submit"

• Przycisk wysyłania formularza:

<input type="submit" name="s1" value="Wyślij">

• Ważniejsze atrybuty:

value - napis wyświetlany na przycisku w przeglądarce

name - jeżeli jest, to jest też wysyłana na serwer - można

utworzyć kilka przycisków i sprawdzić który został użyty

Przycisk reset: input type="reset"

• Przycisk czyszczenia formularza:

<input type="reset" value="Wyczyść">

• Ważniejsze atrybuty:

value - napis wyświetlany na przycisku w przeglądarce

13.Scharakteryzuj element <select ...> formularza.

Lista wyboru: select

• Tworzy zwykłą lub rozwijaną listę wyboru:

<select size="…" name="…"> …

</select>

• Znacznik zamykający - obowiązkowy

• Atrybuty:

id, class, style, title,

name - nazwa, pod jaką zawartość będzie wysłana do serwera

size - rozmiar pola (znaczenie zależnie od typu)

multiple - możliwość wyboru wielu pozycji na liście

disabled - niedostępne dla użytkownika

tabindex - kolejność aktywacji klawiszem tabulatora

onfocus - skrypt wykonywany po uzyskaniu "fokusu"

onblur - skrypt wykonywany po utracie "fokusu"

onchange - skrypt wykonywany po modyfikacji zaznaczenia

14.Scharakteryzuj element <textarea ...> formularza.

Pole tekstowe: textarea

• Tworzy wielolinijkowe pole tekstowe:

<textarea rows="…" cols="…" name="…"> …

</textarea>

• Znacznik zamykający - obowiązkowy

• Atrybuty:

id, class, style, title,

name - nazwa, pod jaką zawartość będzie wysłana do serwera

rows, cols - liczba widocznych wierszy i kolumn

disabled - niedostępne dla użytkownika

readolny - pole tylko do odczytu

onfocus - skrypt wykonywany po uzyskaniu "fokusu"

onblur - skrypt wykonywany po utracie "fokusu"

onselect - skrypt wykonywany zmianie zaznaczenia tekstu

onchange - skrypt wykonywany po modyfikacji zaznaczenia

15.Do czego w formularzach jest wykorzystywany element <label>?

Etykieta: label

• Reprezentuje etykietę przypisaną do pola danych formularza:

<input type="…" id="ID" name="…">

<label for="ID">Opis komponentu</label>

• Znacznik zamykający - wymagany

• Atrybuty:

id, class, style, title,

for - id elementu opisywanego przez etykietę

accesskey - klawisz szybkiego dostępu (skrót klawiaturowy)

onfocus - skrypt wykonywany po uzyskaniu "fokusu"

onblur - skrypt wykonywany po utracie "fokusu"

• Działanie: aktywacja etykiety (skrót klawiaturowy lub kliknięcie)

jest równoważne aktywacji pola danych;

W przypadku kontrolek typu checkbox i radio - obowiązkowe!

16.Wymień różnice (możliwości, sposób przesyłania, sposób odczytywania danych, ...) pomiędzy formularzami przesyłanymi metodą GET i POST.

Sposób przesyłania danych formularza do serwera zależy od

wybranej metody HTTP:

• Metoda GET

<form method="GET" action="plik.php"

enctype="application/x-www-form-urlencoded">

…

</form>

• Metoda POST

<form method="POST" action="plik.php"

enctype="multipart/form-data">

…

</form>

Metoda GET

• Działanie

dane z formularza są przesyłane w żądaniu HTTP:

GET /action.php?name=value&name=value HTTP/1.1

Przeglądarka wyświetla dane formularza w pasku adresu:

www.sth.com/action.php?name=value&name=value

• Cechy:

+ debugowanie, kontrola działania skryptów

- spacje i znaki spoza ASCII są kodowane ("+", "%HH")

- poufne dane są widoczne (bezpieczeństwo!)

- żądania są zapisywane w historii (bezpieczeństwo!)

- nie można przesyłać plików na serwer

Metoda POST

• Działanie

dane z formularza są przesyłane w nagłówkach HTTP:

POST /action.php HTTP/1.1

Host: www.sth.com

… name=value&name=value

Przeglądarka nie wyświetla danych formularza w pasku adresu:

www.sth.com/action.php

• Cechy:

+ poufne dane nie są widoczne ani zapisywane w historii

+ można przesyłać pliki na serwer

- dane nie są szyfrowane (pełne bezpieczeństwo -> HTTPS)

Odczyt danych z formularza

• Dane z formularza są odczytywane z żądania (met. GET) albo

z nagłówka HTTP (met. POST) i dostępne w skrypcie, na kilka

możliwych sposobów:

- zmienne $name

- tablice $HTTP_GET_VARS albo $HTTP_POST_VARS

- tablice $_GET albo $_POST

- tablica $_REQUEST

Niezależnie od użytej metody, wszystkie wartości są

przekazywane jako łańcuchy tekstowe.

17.W jaki sposób przesyłane są dane formularzy dla metody GET (albo: POST) i jakie ma to konsekwencje?

18.Jakie są sposoby odczytania (w skrypcie PHP) danych formularza przesłanego metodą GET (albo: POST)? Które z nich nie są zalecane ze względów bezpieczeństwa?

19.Jakie mogą być powody przesyłania formularzy metodą GET zamiast POST (albo: POST zamiast GET)?

20.Wymień wady i zalety przesyłania danych formularza metodą GET (albo: POST).

21.Jakie błędne założenia na temat danych formularza przesyłanych do serwera mogą stać się powodem nieprawidłowego działania witryny albo nawet ułatwić hakerowi atak na serwer?

22.Jakie działania należy podjąć podczas obsługi formularzy, aby zmniejszyć ryzyko nieprawidłowego działania witryny oraz skuteczności ataku na serwer?

---