Javascript upit s uvjetom. Opis metoda upozorenja, potvrde i upita u JavaScriptu. Stalni XSS napad

U ovom ćemo članku naučiti tri zanimljive metode, naime metode alert(), confirm() i prompt(). Svi su dizajnirani za interakciju s korisnikom.

Sve ove tri metode pripadaju objektu prozora (Browser Window). I mogu se zvati ovako: window.method_name(); Ali JavaScript nam dopušta da ne odredimo ovaj objekt prozora, već da jednostavno napišemo naziv metode.

Počet ćemo s metodom alert(). Ova metoda prikazuje navedenu poruku u prozoru preglednika korisnika. Ovaj prozor će se pojaviti na vrhu cijele stranice i neće se zatvoriti sve dok korisnik ne klikne na gumb OK.

Da bismo to demonstrirali, prikažimo poruku pomoću metode alert().

Var today_is = "ponedjeljak"; upozorenje("Danas " + danas_je);

Unutar metode možemo navesti bilo koji string, samo bez html oznaka. Ovdje se ne obrađuju, već se prikazuju onakvi kakvi jesu.

Ako je linija koju želimo naznačiti jako duga, a želimo stvoriti novu liniju, onda je ovdje html oznaka
neće raditi. Ovdje morate koristiti znak "\n".

Upozorenje("Punooooooooooo \nStringgggggg");

Ova metoda se često koristi za pronalaženje grešaka u kodu.

Proces obrade koda ide odozgo prema dolje, tako da uhvatimo pogrešku, jednostavno upišemo metodu alert() u očekivano područje gdje se pogreška nalazi. A ako je alert() radio, onda nema grešaka do retka u kojem je napisano.

Zatim ga trebate premjestiti jedan red ili više niže. Spremamo promjene, ponovno osvježimo stranicu u pregledniku i vidimo da li je alert() radio, tada nema grešaka do retka gdje se nalazi, inače, ako nije radio, greška se nalazi u linija iznad linije na kojoj se trenutno nalazi. Ovako možete pronaći grešku u kodu.

Ova metoda se koristi za potvrdu odgovora na pitanje. Postoje samo dvije mogućnosti odgovora, da (OK) ili ne (Odustani). Ako korisnik odgovori potvrdno, tada metoda vraća true, inače vraća false.

Na primjer, prikazat ćemo prozor pomoću metode confirm(), gdje ćemo pitati korisnika "Jeste li sigurni da želite napustiti stranicu?" Ako korisnik odgovori potvrdno, tada ćemo kroz metodu alert() prikazati sljedeću poruku “Korisnik želi napustiti stranicu”, u protivnom ćemo prikazati drugu poruku “Korisnik NE želi napustiti stranicu”.

Var user_answer = confirm("Jeste li sigurni da želite napustiti stranicu?"); if(user_answer) alert("Korisnik želi napustiti stranicu"); else alert("Korisnik NE želi \nnapustiti stranicu");

Ovako funkcionira metoda confirm(). Može se koristiti u različitim prilikama. Na primjer, prije uklanjanja nečega sa stranice, uobičajeno je pitati korisnika je li siguran u svoje postupke. Ili, prije slanja obrasca, također možete pitati korisnika „Jeste li sve ispravno ispunili?“ Ako odgovori potvrdno, obrazac će biti poslan, inače neće biti poslan.

Posljednja metoda koju ćemo naučiti je metoda prompt(). Ova metoda se koristi rjeđe od druge dvije metode. Omogućuje primanje nekih informacija od korisnika koje će on unijeti u tekstualno polje.

Kao rezultat toga, metoda prompt() vraća ili uneseni niz ako je korisnik kliknuo gumb OK ili null ako je korisnik kliknuo gumb za odustajanje.

Kao parametar, odnosno unutar zagrada ove metode, možemo napisati indikativni red ili pitanje kako bi korisnik znao koje podatke treba unijeti.

Na primjer, zamolimo korisnika da odgovori na pitanje "Kako se zoveš?" Ime koje je unio korisnik bit će prikazano na zaslonu pomoću metode alert().

Var name = prompt("Kako se zoveš?"); alert("Vaše ime je " + ime);

Spremite i otvorite stranicu u pregledniku.

Naravno, možete unijeti bilo koju informaciju u tekstualno polje iz metode prompt(). Ove informacije će biti vraćene kao niz, čak i u slučaju brojeva ili drugih posebnih znakova.

Na primjer, zamolimo korisnika da unese dva broja i zatim ih pomnoži. Bit će nekakav kalkulator za množenje brojeva.

Var x = prompt("Unesite prvi broj:"); var y = prompt("Unesite drugi broj:"); //Konvertirajte unesene brojeve iz string tipa u numerički tip x = Broj(x); y = Broj(y); document.write(x + " * " + y + " = " + (x * y));

Uneseni brojevi su nizovi, pa za točan rezultat množenja te brojeve je potrebno provući kroz funkciju Number() koja ih iz niza pretvara u normalne brojeve.

Pa, to je sve. Sada znate još tri metode: alert(), confirm() i prompt(). Što možete sigurno koristiti u praksi.

• metode prozorskih objekata;
• alert() metoda: kratki sažetak;
• confirm() metoda - pisanje slova;
• prompt() metoda - predstavimo se, ja sam Stirlitz.

Dakle, objekti preglednika. I prije svega - najstariji od njih, prozorski objekt.

Evo glavnih metoda objekta prozora (osim njih, postoje i drugi, ali se rijetko koriste, a kako ne bih zatrpao svoj mozak nepotrebnim informacijama, odgodit ću ih do treće serije).

Već znamo da se prozor često podrazumijeva, ali nije napisan.

Prozori za dijalog koriste se u programima za interakciju s korisnikom.

metoda alert().

Gledali smo to na samom početku studija. Stvara jednostavan dijaloški okvir s porukom i gumbom OK. Sva njegova interakcija je ograničena na činjenicu da korisnik pritiskom na ovaj jedini gumb može poslati ovaj prozor negdje daleko (i hvala mu na tome).

potvrdi() metoda

Confirm() metoda već omogućuje korisniku da donese jednostavnu "Booleovu" odluku: kaže "da" ili "ne".

Na primjer, kliknite ovaj gumb:

Oprosti na maloj šali. Nadam se da znate koristiti gumb za povratak.

Kako to sve funkcionira? Vi ste, naravno, vidjeli da sam kombinirao ovu metodu s upozorenjima. A to se radi pomoću funkcije koja je umetnuta u .

Metoda vraća dvije vrijednosti: true (ako je u redu) i false (ako je poništeno).

Kada je postavljeno na true, šaljemo ga na odgovarajuću stranicu (svojstvo href objekta lokacije) i ispisujemo odgovarajuće upozorenje(). Inače (tj. false ) jednostavno ispisujemo još jedno upozorenje() .

A u gumbu pozivamo funkciju u događaju onClick:

Zatim morate pozvati ovu funkciju iz onSubmit rukovatelja događajem oznake, na primjer:

Evo, na primjer, možete mi poslati e-poštom sve što mislite o mojim lekcijama. Ako ste se iznenada uzbudili i pritisnuli tipku, a onda je postalo nekako neugodno, pojavit će se dijaloški prozor i otrijezniti vas.

Ako pravite skočne prozore, onda je dobra praksa upozoriti korisnika na to i dati mu izbor - otvoriti prozor ili ga ne otvoriti. Da biste to učinili, prije učitavanja prozora morate otpustiti dijalog “parlamenter” - confirm(). Ovdje se funkcija poziva iz . O tome ćemo govoriti vrlo brzo kada prijeđemo na kreiranje prozora pomoću open() metode.

metoda prompt().

Ova metoda već zahtijeva određene podatke od korisnika. Pojavljuje se dijaloški okvir s poljem za unos. Metoda vraća podatke koje je korisnik unio u ovo polje i omogućuje programu da radi s tim podacima.

Metoda prompt() ima dva argumenta: pitanje (koje se pojavljuje iznad polja za unos) i odgovor (tekst u polju za unos):

Ako želite da polje za unos izgleda prazno, stavite prazne navodnike kao drugi argument:

Pogledajmo ovo na djelu. Pritisnite dugme, ne bojte se.

Dakle, unijeli ste (ili niste unijeli) podatke i dobili odgovor od računala na temelju tih podataka (ili nedostatka istih).

Evo jednostavne verzije ove funkcije:

Svojstvo innerHTML, koje nam omogućuje kontrolu sadržaja oznake, susreli smo u lekciji 10, kada smo programirali imena ispod slika.

A ovdje je kod za gumb i prazan paragraf za pozdrav.

Ali ako ste slučajno moj imenjak, vidjeli ste da je funkcija i na ovo odgovorila.

Kako to učiniti u "gruboj" verziji, već možete pogoditi sami. Morate provjeriti varijablu user_name ne samo za prazne navodnike, već i za " Andrej“, te ubacite još jedan if s odgovarajućim tekstom (možete i sami uvježbati).

Ali ako upišete " Andrej", "Andryusha", "Andryushka", "Andryukha", "Andrejka", "Andrej Ivanovič" itd., tada će rezultat biti sličan, iako nisam eksplicitno prošao kroz sve te vrijednosti, već sam prošao sa samo pet redaka: " Andre", "Andrija", "Andrej", "Andrejce"I" Andrejič(posljednja tri - isključiti Andrejeva, Andrejčenka i Andrejčuka iz svojih imenjaka, a zadržati Andrejčika kao svoje imenjake).

To jest, možete pretpostaviti da funkcija provjerava varijablu user_name za prvih 5, 6 ili 8 znakova.

No, o tome ćemo malo kasnije, kada prijeđemo na string objekte i njihove metode. Samo želim da unaprijed zamislite probleme koje moramo riješiti (osobito, sve vrste dijeljenja nizova u podnizove). Tada će i same odluke djelovati jasnije. Ali ako ne možete čekati, možete "kopirati" funkciju iz koda i "iskasapiti je kao orah". Za one znatiželjne, tamo sam napisao komentar.

Metoda prompt() također se može koristiti za unos lozinke.

Ovo nije kraj lekcije!

Idemo se malo “igrati špijuna” pa da pročitamo ovo poglavlje do kraja. Prvo pokušajte pritisnuti gumb i nešto upisati.

Ah, to je to! Ali pogledajte, postoji još jedan gumb! Dođi...

Lozinka:

Ponovno pritisnite prvi gumb i unesite ispravnu lozinku.

Sva ova zabava, možda, ima učinka, ali zapravo lozinku možete saznati pritiskom na desnu tipku i gledanjem u kodu. Neki možda naivno misle da je kod dovoljno staviti u zasebnu .js datoteku. Ali u kodu stranice nalazit će se poveznica na ovu datoteku koja označava adresu. A ako ga upišete u adresnu traku, otvorit će se datoteka s JavaScript kodom :)

Je li moguće šifrirati lozinku u kodu? Moguće je, ali to opet zahtijeva manipulaciju nizovima uz korištenje nekih matematičkih metoda. Kad dođemo do svega ovoga, proučit ćemo i skriptu za “pravu” lozinku. Ali tehnika za interakciju s korisnikom i dalje će biti ista: metoda prompt(). (Da li je moguće “provaliti” šifriranu lozinku? Ajme, hakerskom savršenstvu nema granica...)

Na isti način na koji smo “uhvatili” ime ili njegov nedostatak, funkcijom ćemo uhvatiti i lozinku.

Ako unesete pogrešnu lozinku ili ne unesete ništa, linija

document.getElementById("ne").style.display = "blok"

otvorit će blok s drugom tipkom

A ako se unese ispravna lozinka, radnja se prenosi na liniju

document.getElementById("yes").style.display = "block" ,

koji otvara sljedeći blok

Čekaj, kakvi su ovo kvrgavi bizoni? Ovo je jednostavan kod za šifriranje, objasnit ću ga uskoro.

U međuvremenu, dajem šifru za ove blokove (radi jasnoće, izostavljam tablicu s okvirima, koju sam priložio u zadnjem bloku):

Dakle, o enkripciji. Prilično je jadna. Svatko tko poznaje funkcije escape() i unescape() može ga odmah hakirati.

Funkcija escape("ovdje unesite niz") pretvara znakove u njihove heksadecimalne vrijednosti.

Funkcija unescape("unesite ovdje pucketajući bizon") radi suprotno.

Da biste šifrirali lozinku na ovaj način, morate je pokrenuti kroz escape() kod kuće, kopirati rezultat i zalijepiti ga u unescape(). Ali ovo, ponavljam, nije ozbiljno.

Pa, za kompletan set - funkcija za drugi gumb:

Za prikaz standardnih dijaloških okvira, JavaScript ima samo tri metode koje smo naučili danas. Iako se ove metode ne koriste često, sposobnost samopouzdanog korištenja iznimno je korisna. Jednostavni su, ali u isto vrijeme pripadaju, da tako kažem, “čistom” programiranju. Vrlo su dobri za učenje programskog jezika. I savjetujem vam da eksperimentirate s njima na sve moguće načine, čak i besciljno s pragmatičnog gledišta. Dobro programiranje je zabavna igra, kao i svaka kreativna aktivnost.

I opet, želim vam dobrodošlicu u drugu temu posvećenu jeziku JavaScript, u ​​kojoj ćemo analizirati metode alert, prompt, confrim. Ove su metode ugrađene u jezik Javascript i pomažu nam u interakciji s korisnikom.
Upozorenje prikazuje prozor na zaslonu preglednika s određenim informacijama, koji pauzira skriptu dok korisnik ne klikne OK.
Prompt obično prikazuje prozor koji korisniku postavlja pitanje na koje mora odgovoriti u određenom tekstualnom polju prije nego klikne U redu. Korisnik također ne može ništa unijeti pritiskom na tipku Odustani.
Confirm također prikazuje prozor u kojem korisnik više ne može ništa unijeti u tekstualno polje, već samo kliknuti OK ili Cancel.
A sada, nakon kratkog uvoda, prijeđimo na razmatranje svega navedenog u praksi.

upozoriti, zatražiti, potvrditi



alert("Pozdrav, dragi korisniče!");
var nameUser = prompt("Vaše ime?" , "ime");
var userAnswer = confirm("Jeste li sigurni da želite napustiti stranicu?" );

Kao rezultat toga, kada osvježimo stranicu preglednika, vidjet ćemo prozor dobrodošlice korisniku. Nakon što kliknete OK, pojavit će se sljedeći prozor u kojem će se tražiti vaše ime. Ova metoda ima dva parametra, prvi je obavezan i odgovoran je za naslov koji će biti prikazan, u našem slučaju to je pitanje korisničkog imena. A drugi parametar je odgovoran za vrijednost koja će se prema zadanim postavkama prikazati u tekstualnom polju. Ako unesete svoje ime i kliknete OK, vaše će ime biti smješteno u varijablu nameUser. Ako kliknete gumb za odustajanje, null će biti zapisana u varijablu.
I na kraju, prozor koji pita korisnika želi li napustiti našu stranicu ili ne. U slučaju pristanka, Booleova vrijednost true bit će postavljena u varijablu, au slučaju odbijanja, sukladno tome, false. To je sve što trebate znati o ovim metodama, vidimo se na sljedećim lekcijama!

Postoje tri osnovne operacije u JavaScriptu koje vam omogućuju primanje podataka od korisnika za daljnju obradu u skriptama. To su upozorenje, brzo i potvrda. Za što se koriste, kako ih koristiti i druge nijanse raspravljat ćemo kasnije u ovom članku.

Koristi se za prikaz modalnog prozora na zaslonu preglednika (to znači da korisnik ne može kliknuti ništa na stranici dok ne zatvori ovaj prozor. U ovom primjeru, dok ne klikne "OK" u prozoru).

Nakon što se prikaže poruka sadržana u upozorenju, izvršenje skripte se obustavlja i nastavlja nakon zatvaranja modalnog prozora.

Ako je polje ispunjeno i kliknuto U redu, podaci koje je korisnik unio vratit će se u skriptu.

Sintaksa ove naredbe je nešto kompliciranija od prethodne jer omogućuje postavljanje teksta poruke korisniku i sadržaja polja za unos informacija koje će biti prikazano prema zadanim postavkama: rezultat = prompt(title , zadano ) ; , Gdje

• naslov – poruka koja će biti prikazana korisniku u modalnom prozoru. Argument je potreban.
• zadano – što će se prema zadanim postavkama prikazivati ​​u polju za unos teksta. Također je potrebno, jer ako nije navedeno, može dovesti do pogrešaka u nekim preglednicima. Ako polje za unos podataka želite ostaviti praznim, jednostavno postavite upit na sljedeći način:

  var myTest = prompt("Sve informacije" , """);

Mali primjer korištenja odzivnika:

var year = prompt("Koje ste godine diplomirali na sveučilištu?", 2008.); alert("Vi ste diplomirali " + godina + " godina!" );

Obično se ova naredba koristi za prikupljanje podataka od korisnika koji su potrebni skripti za daljnji rad.

Također predstavlja modalni prozor. Kao što možete pogoditi iz naziva, obično se koristi za koordinaciju nečega s korisnikom.

Zbog toga je dizajniran za interakciju, pruža korisniku gumbe OK i CANCEL, koji skripti vraćaju Booleove vrijednosti true i false Ocjene: 4 (prosječno 4 od 5).

U ovoj lekciji naučit ćemo o metodama alert(), prompt() i confirm() objekta prozora.

Metoda alert() dizajnirana je za prikaz dijaloškog okvira upozorenja s navedenom porukom i gumbom "OK" na korisničkom zaslonu. Može se koristiti za prenošenje važnih informacija korisniku.

window.alert(Parametar_1);

Metoda alert() ima jedan obavezni parametar - ovo je tekst poruke koja se prikazuje u dijaloškom okviru. Ova metoda ne vraća ništa kao rezultat svog izvršenja.

Na primjer, prikažimo dijaloški okvir upozorenja za posjetitelja stranice kada klikne na vezu: Idi na web stranicu

function guessNumber() ( var findNumber = prompt ("Pogodite broj od 1 do 10?"); switch (findNumber) ( case "6": alert("Već je toplije!"); break; case "7": alert ("Vruće je!"); pauza ("Dobro ste pogodili! To je broj 8"); pauza ("Već je toplije!"); : alert("Hladno je! "); ) ... Pogodi broj