UVOD

   <<Povratak na naslovnu

 

 

  • Javascript je najpopularniji programski jezik na svijetu. To je jezik za HTML i web, za servere, računare, laptope, tablet, pametne telephone, i jiš mnogo toga.

  • Javascript je programski kod koji može biti ubačen u HTML kod.

  • Svi moderni pretraživači mogu izvršiti Javascript kod.

1. Javascript: Pisanje u HTML izlaz

 

 

2. JavaScript: Reagovanje na događaj(Event)

 

<!DOCTYPE html>
<html>
<body>

<p>
Javascript može direkno pisati u HTML izlaz:
</p>

<script>
document.write("<h1>Ovo je heading</h1>");
document.write("<p>Ovo je paragraph.</p>");
</script>


</body>
</html>
 
<!DOCTYPE html>
<html>
<body>

<h1>Moj prvi JavaScript</h1>

<p>
Javascript može reagovati na događaje(events). Kao što je kliktanje na dugme.
</p>

<button type="button" onclick="alert('Dobrodošli!')">Kliki me!</button>

</body>
</html>
 
Možeš samo koristiti document.write u HTML izlazu. Ako ga koristiš nakon što je dokument učitan, cijeli document biće preljepljen. Alert() funkcija se ne koristi puno u Javasciptu, ali je odlična za testiranje koda.
Onclick event je jedan od mnogih HTML eventa koje ćeš tek upoznati.
 

3. JavaScript: Pormjena HTML sadržaja

 

 

4. JavaScript: Promjena HTML slika

 

Veoma bitna funksionalnost Javascripta je manipulisanje sadržaja HTML elemenata.

<!DOCTYPE html>
<html>
<body>

<h1>Moj prvi JavaScript</h1>

<p id="demo">
Javascript može promjeniti sadržaj HTML elementa.
</p>

<script>
function myFunction()
{
x=document.getElementById("demo"); // Nađi element
x.innerHTML="Zdravo JavaScript!"; // Promjeni sadržaj
}
</script>


<button type="button" onclick="myFunction()">Klikni me</button>

</body>
</html>
 
<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("bulbon"))
{
element.src="images/pic_bulboff.gif";
}
else
{
element.src="images/pic_bulbon.gif";
}
}
</script>


<img id="myimage" onclick="changeImage()"
src="images/pic_bulboff.gif" width="100" height="180">

<p>Klikni sijalicu da je uključiš/isključiš.</p>

</body>
</html>
 
Često ćeš vidjeti document.getElementByID("neki id"). Ovom naredbom se pristupa odgovarajućem HTML elementu.

Javascript može promjeniti većinu atributa bilo kojeg HTML elementa, ne samo slika.

 
5. JavaScript:Promjena HTML stilova  

6. JavaScript: Validacija unosa

 

Javascript se redovno koristi za validaciju unosa.
<!DOCTYPE html>
<html>
<body>

<h1>Moj prvi JavaScript</h1>

<p id="demo">
Javascript može promjeniti stil svakog HTML elementa.
</p>

<script>
function myFunction()
{
x=document.getElementById("demo") // Nađi element
x.style.color="#ff0000"; // Promjeni stil
}
</script>


<button type="button" onclick="myFunction()">Klikni me!</button>

</body>
</html>

 
<!DOCTYPE html>
<html>
<body>

<h1>Moj prvi JavaScript</h1>

<p>Unesi broj. (Probaj i sa slovom)</p>

<input id="demo" type="text">

<script>
function myFunction()
{
var x=document.getElementById("demo").value;
if(x==""||isNaN(x))
{
alert("Nije broj");
}else { alert("Unijeli ste broj.") }

}
</script>

<button type="button" onclick="myFunction()">Klikni me!</button>

</body>
</html>
 

 <<Povratak na naslovnu