medelaktivt javascript tutorial

JavaScript har en gång enkelt scriptspråk för att lägga minimal interaktion till webbsidor bli en fullfjädrad språk i sin egen rätt , och har luftballong till ett omfattande ämne som berör nästan alla aspekter av webbutveckling . För utvecklare som behärskar grunderna i JavaScript , Document Object Model , eller DOM , och validering med reguljära uttryck blir utmärkta områden i studien

Du behöver : .
textredigerare , t. ex. Anteckningar
Moderna webbläsare , såsom dvs 8 eller Firefox 3 .
6

interagera med DOM

1
Skapa en webbsida med hjälp av koden : .

;

Spara sidan som ” dom . html . ”
2 .
Bläddra till filen ” dom. html ” från din webbläsare . Klicka på ” Klicka här ” knappen. klickhändelsen kommer avfyra en JavaScript -funktion som ändrar innehållet i texten ovanför knappen .
3 .
Utforska JavaScript -kod från provet . Det använder document. getElementById funktion i kombination med innerHTML fastigheten. getElementById metoden efter DOM för element som har ett särskilt ID som ett attribut . innerHTML fastigheten finns det html som finns i taggarna i ett element . Genom att få ett element med id och förändra innerHTML elementets värde kan du ändra det innehåll som visas på sidan .

Validate med reguljära uttryck

1 .

Skapa en webbsida som innehåller följande kod :

vanliga uttryck Test

Spara
sida som " regExpEscape . html "
6 .
Bläddra till " regExpEscape. html " från din webbläsare . Koden kommer att testa strängen " 123 " för att se om det innehåller siffror .
7 .
Ändra värdet för testString till " äpple " och se vad som händer . Prova att ändra testString till " apple1 . "
8 .
Prova ett exempel från verkliga livet . Reguljära uttryck är mycket kraftfulla och ett enda uttryck kan innehålla en hel del sträng matchning information . Det vanliga uttrycket validerar nedan telefonnummer som är sju eller 10 siffror lång och använda parenteser , bindestreck eller blanksteg som avgränsare . Det tillåter även förlängningar .

^(?:(?: \ + ? 1 \ s *(?:[. -] \ s *)?)?(?: \ ( \ s * ( [ 2-9 ] 1 [ 02-9 ] | [ 2-9 ] [ 02-8 ] 1 | [ 2-9 ] [ 02-8 ] [ 02-9 ] ) \ s * \ ) | ( [ 2-9 ] 1 [ 02-9 ] | [ 2-9 ] [ 02-8 ] 1 | [ 2-9 ] [ 02-8 ] [ 02-9 ]) ) \ s *(?:[. -] \ s *)?)?([ 2-9 ] 1 [ 02-9 ] | [ 2-9 ] [ 02-9 ] 1 | [ 2-9 ] [ 02-9 ] { 2 } ) \ s * ( : ? [ .-] \ s *)?([ 0-9 ] { 4 })(?: \ s *(?:#| x \ | . ? ext \ | . ? förlängning ) \ s * ( \ d +) ) ? $