Primii pasi in javascript

Stefanescu Mihai Stefanescu Mihai Javascript cu 6 luni în urmă
Fii primul care comenteaza!

In acest articol am sa povestesc despre cum putem adauga javascript in pagina noastra atat  in fisierul html, inline cat si intr-un fisier extern.

 

Cum adaugam javascript in pagina

 

Exista 3 moduri de a adauga javascript in pagina noastra

  • In HTML-ul paginii intr-un tag <script>

  • Intr-un fisier extern cu extensia .js care se va incarca in pagina folosind atributul src al tag-ului <script>

  • Inline, apeland javascript-ul pe un tag html folosind un atribut precum onclick, onmouseover, onkeypress,onload, etc

 

Javascript in folosind tag-ul <script>

 

Putem adauga javascript in pagina noastra  putem crea un tag <script> </script> in  interiorul caruia sa punem codul nostru javascript.

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Invata-Programare</title> 
</head> 
<body> 
    <script> 
        // am creat o variabila care are ca si valoarea un sir de caractere 
        var salut = "Salutari comunitatii Invata-Programare.ro"; 
        // urmatorul rand afiseaza pe ecran continutul variabilei 
        document.write(salut); 
    </script> 
</body> 
</html>

Cum incarcam Javascript dintr-un fisier extern

 

De asemenea, putem pune codul javascript intr-un fisier extern cu extensia .js si adaugat in pagina folosin atributul src al tag-ului <script>

<script src="js/salutari.js"></script>

Punem aceasta linie de cod  inainte de a inchide tag-ul </body> din fisierul html si facem un fisier nou, salutari.js in folder-ul js:

// am creat o variabila care are ca si valoarea un sir de caractere 
var salut = "Salutari comunitatii Invata-Programare.ro"; 
// urmatorul rand afiseaza pe ecran continutul variabilei 
document.write(salut);

Acum, cand intram pe pagina o sa vedem mesajul setat in fisierul .js

 

Cum punem javascript inline

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Invata-Programare</title> 
</head> 
<body> 
    <div onclick="alert('Salutari comunitatii Invata-Programare.ro')">click pe acest element</div> 
</body> 
</html>

De asemenea, putem folosi javascript in mod inline, direct in tag-ul html dorit folosind unul dintre atributele menionate mai sus, onclic, onmouseover, onkeypress, onload si asa mai departe.

 

Pozitia elementului script in fisierul HTML

 

Elementul <script> poate fi pus atat in sectiunea <head> a fisierului HTMl cat si in sectiunea <body>. In mod ideal, acesta este pozitionat inainte de inchiderea tag-ului <body>, pentru a incarca fisierul javascript dupa ce pagina a fost incarcata.

 

Elementul <script> va bloca afisarea paginii pana cand ce javascript-ul nu este complet incarcat (fie el intr-un fisier separat sau in fisierul HTML intre tag-urile script).

Avem un cod de conduita.
Folosim cookie-uri pentru a oferi functionalitatile critice ale aplicatiei Invata-Programare. Folosim cookie-uri si pentru a analiza traficul, pentru care e nevoie de consimtamantul dvs. explicit.