ObjectesJavascript II III

CFGS DESENVOLUPAMENT DAPLICACIONS WEB.
OBJECTES JAVASCRIPT II
LObjecteNavigator
LObjecte Navigator permet identificar les caracterstiques de la plataforma sobre la qual
sest executant laplicaci web. En concret permet conixer dades com el tipus de
navegador,laversi,elsistemaoperatiudelusuari...
Tantelsmtodescomlespropietatsdaquestobjectesonnicamentdelectura.
Propietats Descripci
appCodeName Retornaelcodidelnomdelnavegador.
appName Retornaelnomdelnavegador.
appVersion Retornalaversidelnavegador.
cookieEnabled Determinasilescookiesestanhabilitadesono.
platform Retorna la plataforma sobre la qual sest executant el
navegador.
userAgent Retornaunainformacicompletasobrelagentdusuari,elqual
normalmentselnavegador.
Mtode Descripci
javaEnabled() Informasielnavegadoresthabilitatpersuportarlexecucide
programesescritsambJava.
Exemple
<html>
<head>
<title> Objecte Navigator </title>
</head>
<body>
<script type="text/javascript">
document.write ("<b>Propietat appCodeName: </b>" + navigator.appCodeName);
document.write ("<br><b>Propietat userAgent: </b>" + navigator.userAgent);

</script>
</body>
</html>
Exempledecomcarregardiferentspginessegonselnavegadordelclient:
<script language="JavaScript">

</script>
LObjecteScreen
LObjecteScreencorresponalapantallautilitzadaperlusuari.Constade6
propietats,totesdelectura.
availHeight Correponalalturadisponibledelapantallaperlsdefinestres.
availWidth Correspon a lamplada disponible de la pantalla per ls de
finestres.
colorDepth Corresponalnombredecolorsquepotrepresentarlapantalla.
Height Corresponalalturatotaldelapantalla.
pixelDepth Correspon a la resoluci de la pantalla expressada en bits per
pxel.
Width Corresponalampladatotaldelapantalla.
Exemple:
<html>
<head>
</head>
<body>
document.write ("<b>Propietat availHeight: </b>" + screen.availHeight);
document.write ("<br><b>Propietat width: </b>" + screen.width);
</script>
</body>
</html>
CFGS DESENVOLUPAMENT DAPLICACIONS WEB.
OBJECTES JAVASCRIPT III
LObjecte Window
LObjecte Window es considera lobjecte ms important del llenguatge Javascript, ja que a
partir daquest podem gestionar les finestres del navegador. Tamb es considera com un
objecte implcit, ja que no es necessari nombrar-lo per accedir als objectes ubicats baix el seu
nivell de jerarquia. Per exemple, si volgussim mostrar un missatge emergent haurem
descriure window.alert().
Mtodes Descripci
alert() Genera un quadre de dileg amb un missatge i un bot per
acceptar. (1)
prompt() Genera un quadre de dileg per a que lusuari introdueixi valors.
window.prompt("sometext","defaultvalue");
confirm() Genera un quadre de dileg amb els botons Aceptar (true) i
Cancelar (false).
open() Obre una finestra. (1)
window.open(URL,name,specs,replace)
close() Tanca una pgina. (1)
resizeTo() Modifica el tamany duna finestra. (1)
print() Imprimeix una pgina. (1)
moveTo() Mou la pantalla activa. (1)
focus() Activa una finestra. (1)
setInterval() Evalua una expressi despres dun temps especificat. (1)
ID = setInterval(code,millisec)
clearInterval(id) Atura linterval iniciat passant per parmetre lidentificador
daquest
closed Retorna un valor boole que indica si la finestra esta tancada o
no. (1)
document Correspon al document actual de la finestra.
frames Correspon al conjunt de frames de la finestra. (1)
length Correspon al nombre de frames de la finestra. (1)
innerHeight Correspon a laltura utilitzable de la finestra(1).
innerWidth Correspon a lamplada utilitzable de la finestra.
LObjecte Location
LObjecte Location correspon a la URL de la pgina web en s. Les seves principals
funcions son les de consultar les diferents parts que formen una URL, com per
exemple el domini, el protocol o el port. Podrem recarregar una pgina o carregar-ne
una de nova.
host i Correspon a la cadena que representa el nom del domini del servidor i
hostmane el nmero de port dins de la URL. (1)
href Correspon a la ruta absoluta que ocupa el fitxer. (1)
pathname Correspon a la ruta que segueix al nom del servidor. (1)
port Correspon al nmero de port de la URL. (1)
protocol Correspon al protocol utilitzat per la pgina web. (1)
Mtodes Descripci
assign() Carrega un nou document. (1)
reload() Carga de nou el document actual.
Exemple:
<html>
<head>
</head>
<body>
document.write("URL completa: " + location.href);
document.write("<br> Pathname: " + location.pathname);
document.write("<br> Protocol: " + location.protocol);
</script>
<br>
<input type="button" value="assign"
onclick="location.assign('http://www.google.es')">
</body>
</html>
LObjecte History
LObjecte History emmagatzema les referncies de tots els llocs web visitats.
Aquestes referncies es guarden en una llista. Al ser una llista de referncies no
podrem accedir als noms de les direccions URL visitades, ja que son informaci
privada de lusuari.
Mtodes Descripci
back() Carrega la URL del document anterior de lhistorial (1).
forward() Carrega la URL del document segent de lhistorial (1).
go() Carrega la URL del document especificat per lndex que passem per
parmetre (1).
Exemple:
<form>
<input type="button" value="Endarrera" onclick="history.back();">
<input type="button" value="Endavant" onclick="history.forward();">
<input type="button" value="Endarrera" onclick="history.go(-1);"
</form>
LObjecte Document
A partir de lobjecte Document podrem accedir a tots els elements HTML de la nostra
pgina, ja que consta duna srie de subobjectes tals com els vincles, imatges,
formularis, ... A continuaci es presentaran les principals propietats i mtodes
daquest objecte.
Propietats:
anchors: Retorna la collecci dels punts danclatge del document.
Sintaxi: document.anchors[].property
Exemples:
<html>
<body>
<a name="html">HTML Tutorial</a><br>

<a name="css">CSS Tutorial</a><br>
<a name="xml">XML Tutorial</a><br>
<p>Number of anchors:
<script>
document.write(document.anchors.length);
</script></p>
</body>
</html>
Number of anchors: 3
<html>
<body>
<a name="html">HTML Tutorial</a><br>

<a name="css">CSS Tutorial</a><br>
<a name="xml">XML Tutorial</a><br>
<p>innerHTML of first anchor:

<script>
document.write(document.anchors[0].innerHTML);
</script></p>
</body>
</html>
InnerHTML of first anchor: HTML Tutorial
Forms: Retorna la collecci de formularis del document.

Sintaxi: document.forms[].property
Images: Retorna la collecci dimatges del document.
Sintaxi: document.images[].property
Links: Retorna la collecci denllaos del document.
Sintaxi: document.links[].property
alinkColor: Correspon al color dels vincles actius de la pgina.

bgColor: Correspon al color de fons del document.
fgColor: Correspon al color de fons del document.
Exemple:
document.bgColor="green"
document.alinkColor="black"
</script>
cookie: Correspon al fitxer guardat en lequip del client amb la informaci sobre
lusuari.
title: Afegeix/Retorna el ttol del document.
URL: Retorna la url completa del document.
s el mateix que fer document.href
Mtodes:
getElementById: retorna l'objecte que t l'identificador especificat.
getElementsByName: retorna una collecci d'objectes amb el mateix nom.
write: escriu expressions HTML al document de la finestra especificada.
Exemple:
<html>
<head>
<script>
function myFunction()
{
var x = new Date();
document.getElementById("demo").innerHTML= x;
}
</script>
</head>
<body>
<p>Click the button to display the actual Date.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
</body>
</html>
<html>
<head>
<script>
function myFunction()
{
var x = new Date();
document.getElementById("demo").value= x;
}
</script>
</head>
<body>
<p>Click the button to display the actual Date.</p>
<button onclick="myFunction()">Try it</button>
<input type="text" id="demo" value="">

</body>
</html>

ObjectesJavascript II III

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

ObjectesJavascript II III

Uploaded by

Copyright:

Available Formats

CFGS DESENVOLUPAMENT DAPLICACIONS WEB.

document.write ("<br><b>Propietat userAgent: </b>" + navigator.userAgent);

CFGS DESENVOLUPAMENT DAPLICACIONS WEB.

OBJECTES JAVASCRIPT III

<a name="html">HTML Tutorial</a><br>

<a name="html">HTML Tutorial</a><br>

<p>innerHTML of first anchor:

Forms: Retorna la collecci de formularis del document.

alinkColor: Correspon al color dels vincles actius de la pgina.

<p>Click the button to display the actual Date.</p>

<button onclick="myFunction()">Try it</button>

<p>Click the button to display the actual Date.</p>

<button onclick="myFunction()">Try it</button>

<input type="text" id="demo" value="">

You might also like