Atpakaļ

Mērķis: Javascript pamatu apgūšana

Uzdevums 1: Izveidot ciklu

  1. Izveidojiet JavaScript programmu, kas:
    1. Izvada skaitļus no 1 līdz 100.
    2. Bet, ja skaitlis dalās 3, tad izvada "Fizz". Ja skaitlis dalās ar 5, izvada "Buzz".
    3. Ja skaitlis dalas gan ar 3, gan ar 5 - izvada FizzBuzz.
    4. Izvadei uz ekrāna izmantojiet funkciju document.writeln()
    5. Izmantojiet kādu no cikla operatoriem - "for", "while" "do ... while" utt.

Uzdevums 2: Formas validācija

  1. Izveidojiet formu un JS programmu, kas pārbauda formas datus pirms nosūtīšanas:
    1. Formas lauki: name, surname, username, password, age.
    2. Pārbauda vai lauki ir aizpildīti (nedrīkt būt tukšas vērtības).
    3. Pārbauda vai lietotājvārds ir vismaz 5 simbolus garš.
    4. Pārbauda vai vecums ir no 18 līdz 110.
    5. Pārbauda vai e-pasta adresē ir simbols "@".
    6. Izmantojiet šo kodu (un papildiniet): 
      
<form id="forma">
<input type="text" id="name" value="test">
</form>


<script>
var forma = document.getElementById('forma');

function validateForm(event) {
	event.preventDefault(); // Apturēt forma nosūtīšanu

	var name = document.getElementById('name');
	console.log(name);
	console.log(name.value);

	if (name.value == "mikelis") {
		forma.submit();
	} else {
		// forma nav derīga, paziņojam kas par problēmu
		alert("nepareizs vārds");
	}
}

forma.addEventListener("submit", validateForm, false);
</script>

Uzdevums 3: Ieladēt datus izmantojot AJAX un attēlot lapā

  1. Ielādēt saturu no lapas http://numbersapi.com/111 (vai cita adrese, kas atgriež vienkāršu tekstu).
  2. Attēlojiet atgriezto tekstu mājaslapas elementā.
  3. Piesaistiet elementu ar "click" notikumu, lai ielādētu jaunus rezultātus.
  4. Izmantojiet šo kodu: 
    
// AJAX objekta izveida un reakcijas funkcijas definēšana
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    alert(this.responseText);
  }
};
// AJAX pieprasījums
xhr.open("GET", "http://numbersapi.com/111", true);
xhr.send();

Darbu sagatavojiet jaunā folderī ar nosaukumu "Vārds Uzvārds Prakt45" (aiztājiet ar savu vārdu un uzvārdu).
Praktiskā darba folderi arhivējiet zip formātā.
Nosūtiet arhīvu uz e-pastu mikelis@va.lv.