1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 |
<style> table {font-family: sans-serif} input {font-family: monospace; font-size: 16; font-weight: bolder; color: blue; b ackground-color: lightyellow; text-align: right} </style> <table border="0" cellspacing="0" cellpadding="6" bgcolor="#eee"> <tr><th>Lato a</th><td><input type="text" id="a" name="a" value="3" size="8" /></td> <td id="a-bc">...</td><th id="r3" rowspan="3">...</th></tr> <tr><th>Lato b</th><td><input type="text" id="b" name="b" value="4" size="8" /></td> <td id="b-ac">...</td></tr> <tr><th>Lato c</th><td><input type="text" id="c" name="c" value="5" size="8" /></td> <td id="c-ab">...</td></tr> <tr bgcolor="#dfd"><td></td><td align="center"><input type="button" onclick="controlla()" value="VALUTA" /></td> <td id="a-b">...</td><th id="r1" rowspan="3">...</th></tr> <tr bgcolor="#dfd"><td></td><td></td><td id="a-c">...</td></tr> <tr bgcolor="#dfd"><td></td><td></td><td id="b-c">...</td></tr> <tr><td></td><td></td><td id="a2"></td><th id="r2" rowspan="3">...</th></tr> <tr><td></td><td></td><td id="b2"></td></tr> <tr><td></td><td></td><td id="c2"></td></tr> </table> <script> function controlla() { var a=parseFloat(document.getElementById("a").value); var b=parseFloat(document.getElementById("b").value); var c=parseFloat(document.getElementById("c").value); if(a < b) document.getElementById("a-b").innerHTML="a < b"; else if(a == b) document.getElementById("a-b").innerHTML="a = b"; else document.getElementById("a-b").innerHTML="a > b"; if(a < c) document.getElementById("a-c").innerHTML="a < c"; else if(a == c) document.getElementById("a-c").innerHTML="a = c"; else document.getElementById("a-c").innerHTML="a > c"; if(b < c) document.getElementById("b-c").innerHTML="b < c"; else if(b == c) document.getElementById("b-c").innerHTML="b = c"; else document.getElementById("b-c").innerHTML="b > c"; if(a == b && a == c) document.getElementById("r1").innerHTML="EQUILATERO"; else if(a == b && a != c) document.getElementById("r1").innerHTML="ISOSCELE<br/>a=b"; else if(a == c && a != b) document.getElementById("r1").innerHTML="ISOSCELE<br/>a=c"; else if(b == c && a != b) document.getElementById("r1").innerHTML="ISOSCELE<br/>b=c"; else if(a != b && a != c && b != c) document.getElementById("r1").innerHTML="SCALENO"; else document.getElementById("r1").innerHTML="---"; var a2=a*a; var b2=b*b; var c2=c*c; var a2b2=a2+b2 var a2c2=a2+c2 var b2c2=b2+c2 if(a2 < b2c2) document.getElementById("a2").innerHTML="a<sup>2</sup> < b<sup>2</sup>+c<sup>2</sup>"; else if(a2 == b2c2) document.getElementById("a2").innerHTML="a<sup>2</sup> = b<sup>2</sup>+c<sup>2</sup>"; else document.getElementById("a2").innerHTML="a<sup>2</sup> > b<sup>2</sup>+c<sup>2</sup>"; if(b2 < a2c2) document.getElementById("b2").innerHTML="b<sup>2</sup> < a<sup>2</sup>+c<sup>2</sup>"; else if(b2 == a2c2) document.getElementById("b2").innerHTML="b<sup>2</sup> = a<sup>2</sup>+c<sup>2</sup>"; else document.getElementById("b2").innerHTML="b<sup>2</sup> > a<sup>2</sup>+c<sup>2</sup>"; if(c2 < a2b2) document.getElementById("c2").innerHTML="c<sup>2</sup> < a<sup>2</sup>+b<sup>2</sup>"; else if(c2 == a2b2) document.getElementById("c2").innerHTML="c<sup>2</sup> = a<sup>2</sup>+b<sup>2</sup>"; else document.getElementById("c2").innerHTML="c<sup>2</sup> > a<sup>2</sup>+b<sup>2</sup>"; if(a2 < b2c2 && b2 < a2c2 && c2 < a2b2) document.getElementById("r2").innerHTML="ACUTANGOLO"; else if(a2 == b2c2) document.getElementById("r2").innerHTML="RETTANGOLO<br/>Retto b-c"; else if(b2 == a2c2) document.getElementById("r2").innerHTML="RETTANGOLO<br/>Retto a-c"; else if(c2 == a2b2) document.getElementById("r2").innerHTML="RETTANGOLO<br/>Retto a-b"; else if(a2 > b2c2) document.getElementById("r2").innerHTML="OTTUSANGOLO<br/>Ottuso b-c"; else if(b2 > a2c2) document.getElementById("r2").innerHTML="OTTUSANGOLO<br/>Ottuso a-c"; else if(c2 > a2b2) document.getElementById("r2").innerHTML="OTTUSANGOLO<br/>Ottuso a-b"; else document.getElementById("r2").innerHTML="---"; var ab=a+b; var ac=a+c; var bc=b+c; if(a < bc) document.getElementById("a-bc").innerHTML="a < b+c"; else if(a == bc) document.getElementById("a-bc").innerHTML="a = b+c"; else document.getElementById("a-bc").innerHTML="a > b+c"; if(b < ac) document.getElementById("b-ac").innerHTML="b < a+c"; else if(b == ac) document.getElementById("b-ac").innerHTML="b = a+c"; else document.getElementById("b-ac").innerHTML="b > a+c"; if(c < ab) document.getElementById("c-ab").innerHTML="c < a+b"; else if(c == ab) document.getElementById("c-ab").innerHTML="c = a+b"; else document.getElementById("c-ab").innerHTML="c > a+b"; if(a >= bc) document.getElementById("r3").innerHTML="NON È UN TRIANGOLO<br/>Eccede a"; else if(b >= ac) document.getElementById("r3").innerHTML="NON È UN TRIANGOLO<br/>Eccede b"; else if(c >= ab) document.getElementById("r3").innerHTML="NON È UN TRIANGOLO<br/>Eccede c"; else document.getElementById("r3").innerHTML="È un triangolo!"; } controlla() </script> |
Colori RGB – 2
Calcoli – 2
Operazioni con due argomenti numerici
x | ||
y | ||
+ | < | | |
– | > | & |
* | <= | ^ |
** | >= | << |
/ | == | >> |
% | != | >>> |
Math.max() | || | |
Math.min() | && | |
Math.pow() |
Calcoli – 1
Operazioni con un argomento numerico
Valore della x | |||
+ | Segno più | ! | Not logico |
– | Segno meno | ~ | Not dei bit |
typeof | Tipo? | ||
Math.abs() | Valore assoluto | ||
Math.ceil() | Arrotondamento verso l’alto | ||
Math.floor() | Arrotondamento verso il basso | ||
isFinite() | È finito? | ||
isNaN() | Non è un numero? | ||
Math.round() | Arrotondamento all’intero più vicino | ||
Math.sqrt() | Radice quadrata |
Accesso agli elementi
Le possibilità per accedere a un elemento della pagina sono tante… ed è facile confondersi
|
L’elemento possiede un identificativo unico nella pagina | ||
|
L’elemento possiede un nome unico nella pagina | ||
|
L’elemento possiede un nome unico nella pagina | ||
|
L’elemento possiede un identificativo unico nella pagina | ||
|
Elenco degli elementi di un certo tipo. Seleziona il 2°… |
||
|
Elenco degli elementi con una certa classe | ||
|
Elenco delle immagini nella pagina … moduli, … |
||
|
La larghezza dell’immagine con l’identificativo … | ||
… | … | ||
… | … |
INPUT > range
Prova a interagire con il campo di tipo range
, cambiando anche browser.
|
|||
|
|||
|
|||
|
|||
|
|||
Trascina il cursore e il valore corrispondente apparirà nella casella di testo sottostante |
Riepilogo Javascript
- break, parola riservata
- case, parola riservata
- catch, parola riservata
- continue, parola riservata
- default, parola riservata
- delete, parola riservata
- do, parola riservata
- else, parola riservata
- finally, parola riservata
- for, parola riservata
- function, parola riservata
- if, parola riservata
- in, parola riservata
- instanceof, parola riservata
- new, parola riservata
- parseFloat(x), conversione a float
- parseInt(x), conversione a int
- Math.PI, pi greco
- return, parola riservata
- switch, parola riservata
- this, parola riservata
- throw, parola riservata
- try, parola riservata
- typeof, parola riservata
- var, parola riservata
- void, parola riservata
- while, parola riservata
- width, parola riservata
navigator
Proprietà
- navigator.appCodeName
- navigator.appMinorVersion
- navigator.appName
- navigator.appVersion
- navigator.browserLanguage
- navigator.cookieEnabled
- navigator.cpuClass
- navigator.onLine
- navigator.platform
- navigator.userAgent
- navigator.userLanguage
…
navigator.appCodeName:
navigator.appMinorVersion:
navigator.appName:
navigator.appVersion:
navigator.browserLanguage:
navigator.cookieEnabled:
navigator.cpuClass:
navigator.onLine:
navigator.platform:
navigator.userAgent:
navigator.userLanguage:
document
Proprietà
- document.body
- document.cookie
- document.domain
- document.lastModified
- document.referrer
- document.title
- document.URL
Collezioni di dati
- document.all
- document.anchors[]
- document.forms[]
- document.images[]
- document.links[]
Metodi
- document.close()
- document.getElementById(), restituisce un reference all’oggetto con quell’ID
- document.getElementByName(), restituisce un reference all’oggetto con quel nome
- document.getElementByTagNome(), restituisce una collezione di elementi con quel tag
- document.open()
- document.write()
- document.writeln()
INPUT > number
Prova a interagire con il campo di tipo number
, cambiando anche browser.
|
|||
|
|||
|
|||
|
|||
|
|||
|