Javascript « ValCon >> WWW

Category Archives: Javascript

Classificazione dei triangoli

Posted on 12/04/2020 by admin

Comments off

<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 &Egrave; UN TRIANGOLO<br/>Eccede a";
	else if(b >= ac) document.getElementById("r3").innerHTML="NON &Egrave; UN TRIANGOLO<br/>Eccede b";
	else if(c >= ab) document.getElementById("r3").innerHTML="NON &Egrave; UN TRIANGOLO<br/>Eccede c";
    else             document.getElementById("r3").innerHTML="&Egrave; un triangolo!";
}
controlla()
</script>

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>

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 a=b";

else if(a == c && a != b) document.getElementById("r1").innerHTML="ISOSCELE a=c";

else if(b == c && a != b) document.getElementById("r1").innerHTML="ISOSCELE 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="a2 < b2+c2";

else if(a2 == b2c2) document.getElementById("a2").innerHTML="a2 = b2+c2";

else document.getElementById("a2").innerHTML="a2 > b2+c2";

if(b2 < a2c2) document.getElementById("b2").innerHTML="b2 < a2+c2";

else if(b2 == a2c2) document.getElementById("b2").innerHTML="b2 = a2+c2";

else document.getElementById("b2").innerHTML="b2 > a2+c2";

if(c2 < a2b2) document.getElementById("c2").innerHTML="c2 < a2+b2";

else if(c2 == a2b2) document.getElementById("c2").innerHTML="c2 = a2+b2";

else document.getElementById("c2").innerHTML="c2 > a2+b2";

if(a2 < b2c2 && b2 < a2c2 && c2 < a2b2) document.getElementById("r2").innerHTML="ACUTANGOLO";

else if(a2 == b2c2) document.getElementById("r2").innerHTML="RETTANGOLO Retto b-c";

else if(b2 == a2c2) document.getElementById("r2").innerHTML="RETTANGOLO Retto a-c";

else if(c2 == a2b2) document.getElementById("r2").innerHTML="RETTANGOLO Retto a-b";

else if(a2 > b2c2) document.getElementById("r2").innerHTML="OTTUSANGOLO Ottuso b-c";

else if(b2 > a2c2) document.getElementById("r2").innerHTML="OTTUSANGOLO Ottuso a-c";

else if(c2 > a2b2) document.getElementById("r2").innerHTML="OTTUSANGOLO 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 Eccede a";

else if(b >= ac) document.getElementById("r3").innerHTML="NON È UN TRIANGOLO Eccede b";

else if(c >= ab) document.getElementById("r3").innerHTML="NON È UN TRIANGOLO Eccede c";

else document.getElementById("r3").innerHTML="È un triangolo!";

}

controlla()

</script>

Colori RGB – 2

Posted on 02/02/2019 by admin

Comments off

Calcoli – 2

Posted on 31/01/2019 by admin

Comments off

Operazioni con due argomenti numerici

x
y

+	<	\|
–	>	&
*	<=	^
**	>=	<<
/	==	>>
%	!=	>>>
Math.max()	\|\|
Math.min()	&&
Math.pow()

Calcoli – 1

Posted on 31/01/2019 by admin

Comments off

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

Posted on 24/01/2019 by admin

Comments off

Le possibilità per accedere a un elemento della pagina sono tante… ed è facile confondersi

<form name="nome1">
   <input name="nome2" />
</form>

x=document.nome1.nome2;
x.value="...";

</form>

x=document.nome1.nome2;

x.value="...";

L’elemento possiede un identificativo unico nella pagina

<p name="nome">...</p>

x=document.all.nome;
x.style="...";
x.innerHTML="...";

...

x=document.all.nome;

x.style="...";

x.innerHTML="...";

L’elemento possiede un nome unico nella pagina

<p name="nome">...</p>

x=document.getElementByName("nome");
x.className="..."
x.style="...";
x.innerHTML="...";

...

x=document.getElementByName("nome");

x.className="..."

x.style="...";

x.innerHTML="...";

L’elemento possiede un nome unico nella pagina

<p id="nome">...</p>

x=document.getElementById("nome");
x.style="...";
x.innerHTML="...";

...

x=document.getElementById("nome");

x.style="...";

x.innerHTML="...";

L’elemento possiede un identificativo unico nella pagina

<p>...</p>

x=document.getElementsByTagName("p");
y=x[1];

...

x=document.getElementsByTagName("p");

y=x[1];

Elenco degli elementi di un certo tipo.
Seleziona il 2°…

<p class="classe">...</p>

x=document.getElementsByClassName("classe");

...

x=document.getElementsByClassName("classe");

Elenco degli elementi con una certa classe

<img ... />

x=document.images;
  document.all
  document.anchors
  document.forms
  document.images
  document.links

x=document.images;

document.all

document.anchors

document.forms

document.images

document.links

Elenco delle immagini nella pagina
… moduli, …

<img id="alfa" ... />

x=document.images["alfa"].width;

x=document.images["alfa"].width;

La larghezza dell’immagine con l’identificativo …

…

INPUT > range

Posted on 23/01/2019 by admin

Comments off

Prova a interagire con il campo di tipo range, cambiando anche browser.

<input type="range" />

1	<input type="range" />

<input type="range" value="25" />

1	<input type="range" value="25" />

<input type="range" value="5"
       max="10"     min="5"  />

1 2	<input type="range" value="5" max="10" min="5" />

<input type="range" value="5" 
       max="50"     min="0"   step="5" />

1 2	<input type="range" value="5" max="50" min="0" step="5" />

<input type="range" value="5" 
       max="10"     min="0"   step="0.5" />

1 2	<input type="range" value="5" max="10" min="0" step="0.5" />

<input name="numero" onchange="valore()" type="range" />

1	<input name="numero" onchange="valore()" type="range" />

Trascina il cursore e il valore corrispondente apparirà nella casella di testo sottostante

Riepilogo Javascript

Posted on 16/01/2019 by admin

Comments off

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

Posted on 30/08/2018 by admin

Comments off

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

Posted on 30/08/2018 by admin

Comments off

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

Posted on 20/03/2018 by admin

Comments off

Prova a interagire con il campo di tipo number, cambiando anche browser.

<input type="number" />

1	<input type="number" />

<input type="number" value="2000" />

1	<input type="number" value="2000" />

<input type="number" value="2000"
       min ="1990"   max  ="2010"  />

1 2	<input type="number" value="2000" min ="1990" max ="2010" />

<input type="number" value="2000" 
       min ="1990"   max  ="2010" step="5" />

1 2	<input type="number" value="2000" min ="1990" max ="2010" step="5" />

<input type="number" value="15" 
       min ="10"     max  ="20" step="0.5" />

1 2	<input type="number" value="15" min ="10" max ="20" step="0.5" />

<INPUT type="number" name="numero" onChange="valore()" />

1	<INPUT type="number" name="numero" onChange="valore()" />

Modifica il numero e apparirà nella casella di testo sottostante

RGB
Red
Green
Blue