2. Introduzione
• Cos’è la programmazione?
• Linguaggi
• Compilazione o interpretazione?
• Programmazione per la gestione di sistemi
3. Il nostro ambiente: pagine HTML
<!DOCTYPE html>
<html>
<head>
<title>Pagina di prova</title>
</head>
<body>
Oggi è giovedì
<BR>
<B>Buon giorno! </B>
</body>
</html>
4. Come eseguire
•
•
•
•
Usa un editor per scrivere il testo
Salvalo come a.html
Apri un browser
File… Apri… scegli a.html
5. Lo scheletro per i nostri programmi
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
<!– qui metteremo il nostro codice -->
</script>
</body>
</html>
20. Stampa e vai a capo
<!DOCTYPE html>
<html>
<head>
<script>
function stampaVC(s) {
document.write(s);
document.write(“<BR”);}
</script>
</head>
<body>
<script>
stampaVC("hello");
</script>
</body>
</html>
23. Usare le date
var d=new Date();
document.write(d);
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
Document.write(h+":"+m+":”+s);
24. Condizioni
<head>
<script>
function myFunction() {
var x="Good night";
var time=new Date().getHours();
if (time<20) {
x="Good day";
}
document.write(x);
}
</script></head><body>
Clicca sul bottone: dirà "Good day" se l’ora è meno delle 20:00.</p>
<button onclick="myFunction()">Try it</button>
</body>
25. Condizioni if -else
<head>
<script>
function myFunction() {
var x="";
var time=new Date().getHours();
if (time<20) {
x="Good day";
} else {
x="Good night";
}
document.write(x);
}
</script></head><body>
Clicca sul bottone: dirà "Good day" se l’ora è meno delle 20:00.</p>
<button onclick="myFunction()">Try it</button>
</body>
27. Condizioni – if – else
<head>
<script>
function myFunction() {
var x="Good day";
var time=new Date().getHours();
if (time>21) {
x="Good night";
} else if (time<21) {
x="Good evening";
document.write(x);
}
</script></head><body>
Clicca sul bottone: dirà "Good day" se l’ora è meno delle 20:00.
<button onclick="myFunction()">Try it</button>
</body>
28. Condizioni – if – else if
<head>
<script>
function myFunction() {
var x="Good night";
var time=new Date().getHours();
if (time<18) {
x="Good day";
} else if (time<21) {
x="Good evening";
document.write(x);
}
</script></head><body>
Clicca sul bottone: dirà "Good day" se l’ora è meno delle 20:00.</p>
<button onclick="myFunction()">Try it</button>
</body>
29. Box di conferma
<head>
<script>
function myFunction() {
var x;
var r=confirm(”Premi un bottone!");
if (r==true) {
x=”Hai premuto OK!";
} else {
x=”Hai premutoCancel!";
}
document.write(x);
}
</script>
</head><body>
Schiaccia il bottone per mostrare un box di conferma.
<button onclick="myFunction()">Try it</button>
</body>
</html>
30. Chiedere un input all’utente
var myName = prompt("Come ti chiami?",
"Scrivi qui il tuo nome");
document.write(myName);
31. Esercizio
- Chiedere un numero all’utente
- Se il numero è maggiore di 4 dire “risposta
non valida”
- Altrimenti dire se il numero è pari o dispari.
37. Due esempi complessi con le date
http://www.w3schools.com/js/tryit.asp?filenam
e=tryjs_timing_clock
http://www.w3schools.com/jsref/tryit.asp?filen
ame=tryjsref_date_weekday
38. Scrivere in una posizione della pagina
<h1>La mia pagina web</h1>
<p id="demo">Paragrafo 1</p>
<div id="myDIV”>Div 1</div>
39. Scrivere in una posizione della pagina
<h1>La mia pagina web</h1>
<p id="demo">Paragrafo 1</p>
<div id="myDIV”>Div 1</div>
<script>
document.getElementById("demo").innerHTML="Hello Dolly";
document.getElementById("myDIV").innerHTML="How are
you?";
</script>
40. Un esempio complesso
• http://www.w3schools.com/js/tryit.asp?filena
me=tryjs_timing_stop
