Pentru a putea sa parcurgeti acest tutorial si sa si intelegeti ceva din el trebuie sa aveti cunostinte de HTML si cateva notiuni generale legate de structura limbajelor de programare.
Nu voi mai pierde timpul cu asta si o sa incep cu cateva exercitii simple care va vor ajuta sa intelegeti aceste lucruri elementare.
Dupa cum am spus mai sus, javascript poate fi introdus in interiorul paginilor html. Pentru a fi interpretat de catre browser trebuie sa marcam codul astfel:
<script type="text/javascript">
Codul javascript
</script>
O alta metoda pentru a folosi scripturile javascript, metoda pe care o recomand si o consider mai practica, este aceea de utilizare a scripturilor externe. Cei care folosesc CSS sunt obisnuiti cu folosirea stylesheet-urilor externe. Este aproximativ acelasi lucru: se adreseaza fisierul extern in interiorul etichetei <HEAD> a fisierului html si apoi o modificare a acestui script se propaga in intreg documentul.
Iata cum adresam un fisier JS extern (fisierul extern este exemplu.js):
<html>
<head>
<title>
Exemplu
</title>
<script type="text/javascript" src=exemplu.js>
</script>
</head>
<body>
Continut
</body>
</html>
In continuare voi incerca sa afisez in browser un text folosind javascript.
Exemplul 1
<html>
<head>
<title> exemplu </title>
</head>
<body>
<h1> Text HTML </h1>
<h1> <script type="text/javascript">
document.write("Text javascript");
</script>
</h1>
</body>
</html>
Exemplu
Explicatii suplimentare:
document.write("text javascript");
document este un obiect iar write() este o metoda.
Un obiect poate contine alte obiecte care pot fi considerate proprietati ale acestuia. Spre exemplu document contine alte obiecte, de exemplu title . In javascript acest obiect se identifica cu: document.title. Alt exemplu ar fi obiectul submit care este intr-un formular din pagina. Acesta ar fi adresat document.form.submit.
Iata cateva exemple de obiecte HTML si corespondentele in javascript:Obiectul Tag-ul HTML Coresp. javascript
Pagina Web <body> .... </body> document
Formular HTML
<form name="formular">
... </form> document.formular
Buton
<INPUT TYPE="button" name="buton">
document.formular.buton
Imagine <IMG name="imagine"> document.imagine
write() este o metoda. O metoda ne face sa ne gandim la actiune, au efect asupra obiectelor. Metodele au tot timpul paranteze ( ). O sa mai intalnim in tutorial metode si obiecte si atuci o sa le intelegeti mai bine rolul.
Sa folosim si un fisier extern (exemplu2.js)
Fisierl HTML are codul de mai jos
<html>
<head>
<title>exemplu2</title>
<script type="text/javascript" src="exemplu2.js">
</script>
</head>
<body>
<h1> Text HTML </h1>
<h1 id="text1"> <!-- aplicam un id pe care-l vom defini in JS -->
</h1>
</body>
</html>
Exemplu
Am adresat fisiserul extern javascript in zona <HEAD> a documentului HTML si am atribuit marcajului <h1> id-ul "text1". Un ID javascript functioneaza ca un ID in CSS: poate fi folosit o singura data intr-o pagina. Iata si codul din exemplu2.js :
window.onload = scrieText;
function scrieText() {
document.getElementById("text1").innerHTML = "Text javascript din fisier extern";
}
Ce face acest script:
- dupa ce termina de incarcat fereastra executa functia "scrieText" (window.onload = scrieText
- pasul urmator este definirea functie scrieText(). Aceasta se face intre acolade ({ }).Aceasta functie cauta dupa ID-ul "text1" in documentul HTML si unde il gaseste inlocuieste continutul tagului respectiv cu textul pe care l-am introdus in ghilimele.
Labels:
JavaScript
Previous Article
Responses
0 Respones to "JavaScript - Introducere"
Trimiteți un comentariu