2024W20 Informatica

2024W20 Informatica
Per accedere a javascript è necessario utilizzare in una pagina html il tag <script></script>. Ad esempio:
<html>
<head>
<script> alert("primo codice javascript"); </script>
</head>
<body></body>
</html>
In questo modo verrà visualizzata una finestra popup con il testo "primo codice javascript".
Gli elementi della pagina web possono avere un identificativo specificato con la proprietà ID. Ad esempio:
<html>
<head></head>
<body>
<p id="paragrafo">questo è un paragrafo</p>
<script>
document.getElementById("paragrafo").innerhtml = "javascript";
</script>
</body>
</html>
In questo caso il paragrafo con id "paragrafo" verrà modificato per produrre in output la stringa "javascript". Si ottiene questo
risultato con una serie di passaggi: si accede all’oggetto document, a questo punto si utilizza il metodo
getElementById("paragrafo") e infine si cambia la proprietà innerhtml ponendola uguale alla stringa "javascript". Quindi
document è l’oggetto che rappresenta la pagina web, poi si mette il punto e si utilizza il metodo getElementById() e infine un
ultimo punto e si accede alla proprietà innerhtml.
The Element property innerHTML gets or sets the HTML or XML markup contained within the element.
Per dichiarare una funzione si utilizza la parola chiave function come nel seguente esempio:
<html>
<head>
<script>
function myFunction() {
document.getElementById("paragrafo").innerhtml = "Paragrafo cambiato";
}
</script>
</head>
<body>
<h2>Demo JavaScript in Head</h2>
<p id="paragrafo">Un paragrafo</p>
<button type="button" onclick="myFunction()">Cambia testo</button>
</body>
</html>
In questo ultimo caso si dichiara una funzione myFunction che cambierà il testo del paragrafo e verrà richiamata utilizzando un
bottone: infatti va specificato nel tag del bottone la proprietà onclick e messa uguale al nome della funzione
(onclick="myFunction()").
Si può scrivere del testo nella pagina web utilizzando document.write come nell’esempio seguente:
<html>
<body>
<h1>pagina web</h1>
<script>
document.write(5 + 6);
</script>
</body>
</html>
In questo caso verrà scritto nella pagina web il risultato di 5 + 6 ovvero 11. La differenza di document.write con
document.getElementById("paragrafo").innerhtml è ovviamente quella di non dover specificare un oggetto già presente nella
pagina di cui modificare il contenuto.
Warning: Use of the document.write() method is strongly discouraged.
Per dichiarare le variabili si utilizzano le parole chiave let e const.
<html>
<body>
<p id="demo"></p>
<script>
let carName = "Volvo"; // dichiaro la variabile carName con valore "Volvo"
document.getElementById("demo").innerhtml = carName; // assegno a "demo" il valore della
variabile carName
</script>
</body>
</html>
Per quanto riguarda const semplicemente è una variabile che però non può cambiare di valore una volta inizializzata.
Quindi posso scrivere: let carName = "Volvo"; e successivamente carName = "Ford Fiesta";
Invece con const:
const carName = "Volvo";

carName = "Ford Fiesta"; // questo restituisce un errore!
Si possono dichiarare le stringhe utilizzando le doppie virgolette:
let text1 = "Questo è ";

text1 += "del testo";
Si noti l’utilizzo di += per aggiungere alla variabile text1 dell’ altro testo. E’ equivalente a scrivere:
let text1 = "Questo è ";

text1 = text1 + "del testo";
Valgono gli operatori aritmetici:
let x = 5; // assegno il valore 5

x--; // diminuisco di 1 il valore di x che diventerà 4
let z = x; // assegno a z il valore di x che è 4
Si possono utilizzare le funzioni per ritornare un valore, ad esempio:
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32); // eseguo i calcoli e ritorno il valore finale
}
let value = toCelsius(77); //utilizzo la funzione con parametro 77 e assegno a value il valore
finale.
Questa funzione trasforma i gradi da fahrenheit a gradi centigradi.
Cicli FOR:
invece di scrivere un codice come il seguente
text += 0 + "<br>"; text += 1 + "<br>"; text += 2 + "<br>"; text += 3 + "<br>"; text += 4 + "<br>";
text += 5 + "<br>";
è molto più utile utilizzare un ciclo for in questo modo:
for (let i = 0; i < 6; i++) {

text += i + "<br>";
}
Si utilizza il tag <br> che manda a capo e si concatena utilizzando text += ...
A questo punto utilizzando document.write posso inserire il testo creato nella pagina html (si noti che il testo può contenere altri
tags html):
let text = "";

for (let i = 0; i < 6; i++) {
text += i + "<br>";
}
document.write(text);
20240423
Bottone: <input type="button" id="button" value="calcola" onclick="calcolaRisultato()">
Script: function calcolaRisultato() { let valore0 = document.getElementById("valore0").value;
alert(valore0); }
20240430
<html>
<head>
<style>
#valore0, #button, #testo { color: #050; border-radius: 10px; border: 1px solid #050;
font-size: 30px; width: 200px; }
</style>
</head>
<body>
<div style="text-align: center">
<input type="text" id="valore0" value="0"><br>
<input type="button" id="button" value="Indovina" onclick="indovinaNumero()">
<p style="text-align: center" id="testo"></p>
</div>
<script>
let random = Math.floor(Math.random() * 10) + 1;
function indovinaNumero() {
let valore0 = parseInt(document.getElementById("valore0").value);
if (valore0 > random) {
document.getElementById("testo").innerHTML = "<h1>valore > random</h1>";
} else if (valore0 < random) {
document.getElementById("testo").innerHTML = "<h1>valore < random<h1>";
} else {
alert("valore = random");
random = Math.floor(Math.random() * 10) + 1;
}
}
</script>
</body>
</html>
parseInt seems optional?
Fattoriale: Vettore:
function fattoriale() { let vettore = [];
let fact = 1; for(let i=0;i<10;i++) {
let numero = vettore.push(Math.floor(Math.random()*10));
parseInt(document.getElementById("valore0").value }
); document.write(vettore);
for (let i = 1; i <= numero; i++) {
fact *= i;
}
alert(fact);
}

2024W20 Informatica

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

2024W20 Informatica

Caricato da

Copyright:

Formati disponibili

2024W20 Informatica

Per dichiarare le variabili si utilizzano le parole chiave let e const.

const carName = "Volvo";

Si possono dichiarare le stringhe utilizzando le doppie virgolette:

let text1 = "Questo è ";

let text1 = "Questo è ";

Valgono gli operatori aritmetici:

let x = 5; // assegno il valore 5

Si possono utilizzare le funzioni per ritornare un valore, ad esempio:

Questa funzione trasforma i gradi da fahrenheit a gradi centigradi.

è molto più utile utilizzare un ciclo for in questo modo:

for (let i = 0; i < 6; i++) {

let text = "";

parseInt seems optional?

Potrebbero piacerti anche