Está en la página 1de 14

TEMA 1.

CONCEPTOS GENERALES
1. Actores de la web
El modelo Client/Servidor.

➢ WWW está constituido por conjunto de ordenadores capaces de conversar en Internet


según HTTP.
o Ordenadores que ofrecen información -> Servidores
▪ Funcionamiento automático.
o Ordenadores que las consultan -> Clientes
▪ Se realiza una transferencia por cada objeto deseado.
▪ No debe confundirse con la referencia a un objeto (p.ej. un
hiperenlace), que sólo tiene efecto cuando se pulsa sobre él.
➢ En cualquier caso, hay un software específico que permite adoptar uno de los dos
comportamientos. Para servir es servidor WWW; para consultar es navegador WWW.
➢ EL comportamiento de estos dos es asimétrico.
o El servidor recibe peticiones de tamaño reducido.
o El cliente obtiene respuestas de gran tamaño.

2. Más generalidades
URL: Uniform Resource Locator.

➢ Un URL (rfc1738) es la dirección de un elemento en la web, habitualmente un


documento.

[protocolo://][dirección][:puerto][/ruta]

donde protocolo:

o http es el protocolo estándar de WWW; dirección es una dirección IP.


o ftp es el protocolo de transferencia de ficheros.
o mailto se emplea para envío de correo electrónico; dirección es el nombre del
usuario al que se desea enviar.
o news es el protocolo de acceso a grupos de noticias; dirección es el nombre
del grupo de noticias.

además, donde:

o dirección IP identifica al servidor que se desea acceder. O por valor numérico


o por nombre.
o puerto depende de la configuración del servidor. Por defecto, es el 80.
o ruta especifica el documento concreto dentro del servidor con una
organización jerárquica.
HTML: Hypertext Markup Language

➢ El lenguaje HTML especifica el formato de los documentos estándar en WWW, que se


caracterizan por:
o Poseer enlaces, en URLs, que permiten pasar de este documento a otros.
o Combinar en el documento tanto informaciones textuales como de otros tipos
que son expandibles.
o Poseer ciertas capacidades de organización y formateo de textos.
o Los tags, o marcas, son órdenes incluidas en el propio documento que se
emplean como controles que interpreta el navegador.
➢ Estándar regulado por el Consorcio de WWW (W3C), pero hay más extensiones.

HTTP: Hypertext Transfer Protocol

➢ Permite que un navegador y un servidor web puedan hablar entre sí mediante un


vocabulario.
➢ La versión actual es 2.0 del 2015, pero se sigue usando más la 1.1.
➢ Se basa en un modelo petición/respuesta.

3. Servicio de un objeto en la web.


I. Esperar la petición
a. Estado inicial: el servidor espera la llegada de una petición.
II. Llegada de una petición.
a. Comienza cuando un cliente pide un documento.
b. El software de red del cliente localiza el servidor y establece una conexión
bidireccional.
c. El cliente envía según HTTP.
d. El servidor anota la petición.
III. El servidor procesa la petición.
a. 3 componentes esenciales:
i. Método (GET)
ii. Documento (/ejemplo.html)
iii. Protocolo empleado por el navegador (HTTP/1.0)
b. El método especifica la acción a realizar por el servidor.
IV. Si es necesario, leer información adicional.
a. El servidor obtiene más información describiendo el navegador utilizado y sus
posibilidades.
V. Realizar la operación solicitada.
Para GET: buscar en el sistema de ficheros donde se encuentran los documentos.
a. Si se localiza y el servidor puede leerlo, se puede enviar.
i. Si todo es correcto: enviar.
1. El servidor envía un código de resultado y la descripción del
tipo de información que le llegará al cliente.
2. El servidor lee el contenido del fichero desde el disco y lo
envía por el puerto de comunicaciones.
ii. Enviar una queja en caso de error.
1. Si no se encuentra el fichero o el servidor no puede leerlo, no
podrá servirse la petición.
VI. Finalización.
Cerrar el fichero y terminar la conexión actual.
a. El servidor cierra el fichero y el puerto de comunicaciones.
b. De nuevo, queda atento a la llegada de más solicitudes.

4. Peticiones
Las peticiones incluyen 3 grupos de informaciones.

1. Método solicitado:
a. GET: solicita el documento especificado.
b. HEAD: solicita la información de cabecera del documento.
c. POST: solicita que el servidor acepte el documento especificado como un
ejecutable y le pase la información.
d. PUT: sustituye los contenidos de un documento del servidor con los datos
aportados por el cliente.
2. Cabecera de petición:
a. ACCEPT: tipos de fichero que puede aceptar el cliente.
b. AUTHORIZATION: empleado para identificarse a través de un servidor de
autorizaciones. Incluyen el nombre de usuario y su clave.
c. USER-AGENT: nombre y versión del navegador del cliente.
d. REFERER: URL del último documento visitado por el usuario.
3. Datos solicitados: Si el cliente ha realizado una operación POST, puede enviar los
datos tras la cabecera de petición y una línea en blanco adicional.
a. Si el cliente emite una petición GET o HEAD esperará la respuesta del servidor.

5. Respuestas
1. Código de estado: Es un número de 3 dígitos, y sus valores se dividen en 4 categorías:
a. 200-299 indica que no ha habido problemas.
b. 300-399 indica que no se ha podido acceder al URL porque el documento ha
cambiado de ubicación.
c. 400-499 indican un error del cliente.
d. 500 o superior indica que el servidor no ha podido realizar la operación
solicitada o se ha producido un error.
Los códigos de estados más habituales son:

200 OK, todo bien.


302 Found. Se ha encontrado el URL, pero se redirige a uno nuevo debido a que el
original se ha movido.
304 Use a local copy. Si el navegador ya posee esa página en su caché, preguntará al
servidor cuál es la fecha de última modificación del documento. Si la copia del
servidor NO es más frecuente, el servidor enviará un código 304 en lugar del
documento.
401 Unauthorized. El usuario ha solicitado un documento, pero no ofrece
identificación y/o claves válidos.
403 Forbidden.
404 Not found. No se encuentra en el servidor.
500 Server error. El administrador debería comprobar en el log qué ha ocurrido.
2. Cabecera de respuesta.
a. Contiene información sobre el servidor y documento al que esta cabecera
precede.
b. Campos más habituales son:

Server Nombre y versión del servidor de web.


Date Hora y fechas actuales.
Last-modified Cuándo se modificó el documento por última vez.
Expires El momento en que este documento deja de tener vigencia.
Content-length El número de octetos que ocupan los datos de respuesta.
Content-type El tipo de MIME de esos datos.
WWW- Empleado durante la autenticación, indica al cliente qué informaciones
authenticate se necesitan.

3. Datos de respuesta.
a. El servidor envía una línea en blanco tras el último campo de la cabecera y a
continuación coloca los datos del documento.
b. Si el cliente sólo ha solicitado información de cabecera, el servidor finaliza la
conexión.

6. Introducción a la ejecución en el servidor.


Los componentes de una aplicación en red pueden organizar en “3 niveles”:

I. Nivel de presentación.
a. Lo que el cliente observa a través de una aplicación, como un navegador que
permite mostrar e interactuar con páginas HTML.
II. Nivel de lógica. (Lo que estudiamos en DEW)
a. Se ejecuta en el servidor de web, respondiendo a solicitudes de los clientes y
accediendo a los datos internos de la aplicación o servicio.
b. Pueden ser:
i. orientadas a la web (p.ej. creando objetos MIME)
ii. orientadas a la lógica de negocio (p.ej. manteniendo y actualizando
información de estado).
III. Nivel de datos.
a. Representado por el sistema de información que consta de un conjunto de
bases de datos con la lógica asociada.

El desarrollo de aplicaciones que se ejecutarán en el servidor está mediatizado por los


siguientes estándares aplicables:

➢ HTTP, marca el envío de paquetes entre servidor y cliente.


➢ MIME, identifica la naturaleza de las informaciones enviadas.
➢ CGI, especifica cómo el servidor activa las aplicaciones que implementan los servicios
solicitados por los clientes, cómo les transmite información y cómo recibe los
resultados.

Es fundamental observar que estos programas se ejecutan en el servidor.

➢ Su malfuncionamiento afectaría al propio servidor.


➢ Las aplicaciones deben ser mucho más robustas, comprobando todos los datos que les
llegan.
➢ Los responsables del servidor actúan con cautela a la hora de admitir nuevos
programas o modificaciones en los mismos.

7. El estándar CGI
• Un CGI puede ser desarrollado en cualquier lenguaje con soporte en el servidor.
• Condicionados por la plataforma tecnológica.
• Requisitos de un lenguaje para CGIs:
1. Acceso a variables de entorno: el intercambio de información entre el cliente,
servidor y CGI se realiza mediante esto del protocolo HTTP:
▪ QUERY_STRING: Es la cadena de entrada del CGI cuando se utiliza el
método GET.
▪ CONTENT_TYPE: Tipo MIME de los datos enviados al CGI mediante
POST.
▪ PATH_INFO: Información adicional de la ruta tal y como llega el
servidor en el URL.
▪ CONTENT_LENGTH: Longitud en bytes de los datos enviados al CGI.
▪ REQUEST_METHOD: Método (GET/POST) de invocación del CGI.
▪ SERVER_NAME: Nombre del servidor.
2. Manejo de cadenas (formulario/HTML):
▪ POST: El cliente envía información al servidor en el cuerpo del mensaje
HTTP. Debe emplease cuando la aplicación produce efectos laterales
que modifican o añaden información al servidor.
▪ GET: El cliente especifica un URL y recibe información del servidor. El
cliente no necesita pasar gran información al servidor, ésta se incluye
en la cabecera del mensaje HTTP.
• Escenario de activación CGI.
1. Situación inicial: El cliente solicita la invocación de CGI, involuntaria (envío de
información de cabecera) o explícita (formulario).
2. El cliente pulsa el botón de tipo SUBMIT en el formulario.
3. El servidor recibe el mensaje de petición y pone en marcha CGI. Importante:
Si es GET, la información del formulario se define en QUERY_STRING; Si es
POST, la información se coloca en la entrada estándar del CGI.
4. Ejecución del CGI: El CGI accede a las variables de entorno. Comprueba el
funcionamiento según GET o POST.
▪ Se construye un objeto MIME que se enviará al cliente.
▪ La primera escritura deberá anunciar el tipo de objeto: Content-type:
tipo/subtipo.
▪ Después línea en blanco, y el objeto a devolver.
5. El servidor vuelve al trabajo: Devuelve el control al servidor, que añade
respuesta una cabecera indicando su tamaño.
6. El cliente recibe la respuesta.
• Carencias del CGI.
o No mantienen el estado automáticamente: necesidad de sesiones.
o Se cargan tantas veces como peticiones del servicio existentes de los clientes:
rendimiento mejorable.
8. Plataformas tecnológicas
I. Plataforma JavaEE.
a. Realizar desarrollos en Java apoyados en JavaEE.
b. Esta combinación tecnológica (servlets) se encuentra a caballo entre
CGIs y API del servidor:
i. Ventajas de programación bajo un API.
ii. Enriquecimiento mediante clases que agregan funcionalidad y
propiedades inexistentes en un CGI.
iii. Independencia.
II. Plataformas basadas en PHP.
a. LAMP: Linux + APACHE + MySQL + PHP.
b. Plataforma de carácter libre y madurez.
c. Lenguaje de scripting ligero y sencillo, con bibliotecas de todo tipo.
III. Plataforma ASP.NET.
a. El elemento común es el SO Windows.
i. Ésta gira en torno a Microsoft, IIS y SGBD SQL Server.

TEMA 2. HTML5
1. Estructura de una página web
• Comentarios <!-- Esto es un comentario -->
• Preámbulo:
o XHTML 1.1
▪ <?xml version=”1.0” encoding=”UTF-8” ?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd>
<html xmlns=https://www.w3.org/1999/xhtml>
o HTML 5
▪ <!DOCTYPE html>
<html lang=”es-es”>

• Cabecera <head> </head>. Debe contener <title> </title>


Puede contener:
o <base>. Fija una URL global a partir de la cual se construirán las URLs relativas.

o <meta>. Meta-información sobre el documento.


<meta name=”el_nombre” content=”los_valores” />
Definir cabeceras HTTP:
<meta http-equiv=”Content-Type” content=”text/html;charset=utf-8” />
<meta http-equiv=”pragma” content=”no-cache” />
Controlar display en móviles:
<meta name=”viewport” content=”width=devicewidth; userscalable =0;” />

o <link>. Relacionar el documento HTML con otro externo. Hoja de estilos.


<link type=”text/css” rel=”stylesheet” href=”/styles.css” />
type es el tipo MIME.
rel es la relación entre el documento actual y el referenciado.

o <style>. Definir hojas de estilos en el mismo HTML.


<style type=”text/css”> </style>

o <script>. Interno: <script type=”text/javascript”> </script>


Externo: <script type=”text/javascript” src=”…”> </script>

• Cuerpo <body> </body>. Está la mayoría del contenido HTML que se visualiza.
• Texto básico:
o Entidades:
Carácter Número entidad Nombre entidad
“ &#34; &quot;
& &#38; &amp;
< &#60; &lt;
> &#62; &gt;
Á &#225; &Aacute;
Í &#233; &iacute;
Ñ &#241; &ntilde;
<espacio> &#160; &nbsp;

o Saltos de línea: <br />


o Párrafos: <p> </p>
o Encabezados: <h1>, <h2>, <h3>, … ,<h6>
o Texto preformateado: Aparece tal cual como está escrito <pre> </pre>

• Texto formateado:
o Negrita <b> o Subíndice <sub>
o Itálica <i> o Grande <big>
o Subrayado <u> o Pequeño <small>
o Tachado <s> o Raya horizontal <hr />
o Superíndice <sup> o Teletipo <tt>

• Texto semántico:
o Énfasis: <em>, <strong>
o Citas: <blockquote>, <cite>, <q>
o Abreviaciones: <abbr>, <acronym>, <dfn>
o Código fuente: <code>, <kbd>, <var>, <samp>
o Direcciones: <address>
o Edición: <ins>, <del>

• Listas:
o Listas no ordenadas: <ul> <li> Aquí va algo </li> </ul>
o Listas ordenadas: <ol> <li> Aquí va otro </li> </ol>
o Listas de definición de términos:
<dl>
<dt> Primero </dt> #título en primer nivel
<dd> Lo que quieras </dd> #dato en segundo nivel
<dt> Segundo </dt>
<dd> Lo que sea </dd>
</dl>

• Enlaces: <a href=”…”>contenido</a>. Ese contenido es un hiperenlace a otro sitio.


También puede ser una imagen.
o Para envío de correo:
Básico: <a href=mailto:mimail@upv.es>Env&iacute;a</a>
Extendido: href=”mailto:mimail@upv.es?subject=...&body=...&cc=...&bcc=...
o Destino local:
El punto en la página con <p id=”aquí”>
Enlace a ese punto desde otra página:
<a href=”http://www.miservidor.dom/mipag.html#aqui>Esto</a>
Atributo target: dónde se abre el enlace. Por defecto en la misma ventana.
Nueva ventana: _blank Misma ventana: _self
Atributo title: título cuando ubicamos el ratón encima.

• Multimedia:
o Imagen: <img src=”…” alt=”…” />
Posible añadir height, width dimesiones en píxeles.
Permite arropar cualquier construcción.
<figure id=”…” > … <figcaption> leyenda (subtítulo) </figcaption> </figure>.
Renderizado local: reserva espacio para gráficos por scripting.
<canvas> </canvas>.
Audio: con posibilidad de control.
<audio controls=”controls”>
<source src=”…” type=”audio/mpeg” />
</audio>
Vídeo: muy similar al audio pero con dimensiones
<video width=”…” height=”…” controls=”controls”> … </video>

• Tablas: <table> </table>


Filas con <tr>, cabecera con <th> y columna con <td>
<caption> permite añadir un título a la tabla, aparece después de <table>
Múltiples operaciones:
o Agrupar filas: <thead>, <tbody>, <tfoot>
o Agrupar columnas: <colgroup>
o Expandir filas: <rowspan>
o Expandir columnas: <colspan>
• Formularios: <form action=”…” method=”…” > </form>
action URL donde se enviarán los datos del form.
method GET/POST
otros enctype, onsubmit, onreset
o Etiquetas: <label> </label>
for: identifica el otro campo (input)
o Texto:
▪ Caja de texto: <input type=”text” /> name, id, value (todo lo que hay
dentro de la caja de texto), size, maxlength
▪ Password: <input type=”password” />
▪ Área de texto: <textarea cols=”…” rows=”…” > </textarea>
▪ Oculto: <input type=”hidden” />
▪ Botones de opción: <input type=”radio” />
- name debe coincidir para todas las excluyentes.
- calue contiene el valor aplicable.
- checked para seleccionar una por defecto.
▪ Cajas de verificación: <input type=”checkbox” />
- Igual que botones de opción pero permiten seleccionar varias.
▪ Listas: <select name=”…” size=”…” multiple=”…” >
- size muestra una lista con barra de desplazamiento, en vez de
desplegable.
- multiple permite la selección de varios. Desmarcar con CTRL.
- <option> … </option> para cada opción dentro de la lista.
- selected deja una opción seleccionada por defecto.
▪ Listas con agrupaciones: Igual que listas.
- <optgroup label=”ALGO”> título del grupo.
- <option> </option> opción dentro del grupo.
▪ Botones input:
- Normal: <input type=”button” …/>
- Envío: <input type=”submit” />
- Reinicio: <input type=”reset” />
- Imagen: <input type=”image” src=”…” …/>
▪ Botones button: <button type=”…” …> </button>
▪ Ficheros: <input type=”file” …/>
- accept define los tipos MIME soportados. El * permite
cualquier fichero mientras sea p.ej, image.
<input type=”file” name=”…” accept=”image/*” />
▪ Conjuntos de campos: <fieldset> y <legend>
Permiten agrupar campos (fieldset) dentro de un marco con título
(legend).
▪ Validaciones: <input type=”text” required=”required”… />
- required obliga que se cumplimente ese campo.
- placeholder coloca un mensaje con instrucciones.
- pattern que empiece con un patrón.
<input type=”url” pattern=”https?://.+” … />
• Layout – Diseño:
o <span> </span> Agrupar elementos en línea. No afecta al renderizado. Usado
para marcar un conjunto de elementos.
o <div> </div> Agrupar cualquier número y tipo de elementos en bloque. Para
crear secciones/subsecciones en un documento. No afecta al renderizado.
Usado para marcar secciones.
o HTML5 incorpora elementos que sustituyen a estos divs.
Equivalencia:

▪ <header> Encabezado/Contenido inicial del elemento.


▪ <nav> Agrupa enlaces dentro de esta página o a otras.
▪ <section> Agrupa los apartados del contenido principal. Puede haber
más <section>
▪ <article> Agrupa contenidos que representan una unidad temática. Si
hay solo un article, mejor usar <main>.
▪ <aside> Agrupa un contenido secundario al que acompaña.
▪ <footer> Información general que aparece al final. Pie de página del
elemento que lo contiene.

TEMA 3. CSS
1. Reglas Declaration

h1 {color:blue; font-size;12px;}
Selector
Property Value
• Selectores:
o Universal * {}. Todos los elementos del documento.
o Tipo o tag elem {}. Todos los elementos del mismo tipo elem.
o ID #nombreID {}. Elementos con id único. Selecciona el elemento con el id
especificado.
o Clase .nombreClase {}. Varios elementos pueden coincidir. Selecciona todos los
elementos de la misma clase.
o Pseudo-clases :nombrePseudo-clase {}. Eventos dinámicos, cambio de estado o
situación no representable de otra manera.
▪ Sobre enlaces:
Nombre Ejemplo Qué selecciona
:link a:link Todos los links no visitados
:visited a:visited Todos los links visitados
:active a:active Todos los links activos(cuando se hace click sobre ellos)
:hover a:hover Todos los links que tienen el ratón por encima
▪ Sobre otros elementos:

Nombre Ejemplo Qué selecciona


:focus input:focus El <input> que tiene el foco
:first-child p:first-child El primer hijo de todos los elementos <p>
:last-child p:last-child El último hijo de todos los elementos <p>
:lang html:lang(es) Un documento HTML con idioma español
:nth-child(n) p:nth-child(3) El tercer hijo de todos los elementos <p>
:nth-last-child(n) p:nth-last-child(3) El tercer último hijo de todos los elementos
<p>

▪ Sobre aspectos físicos:

Nombre Ejemplo Qué selecciona


:first-letter p:first-letter La primera letra del texto en <p>
:first-line p:first-line La primera línea del texto en <p>
:before h1:before Antes de cualquier <h1>
:after P:after Después de cualquier <p>

• Combinación de selectores:
o Selector de tipo con clase/ID:
p#aviso { color:blue; } <p id=”aviso”> … </p>
h1.rojo { color:red; } <h1 class=”rojo”> … </h1>
o Selectores de clase encadenados:
p.important.code {} <p class=”important code”> … </p>
o Aplicar lo misma a varios selectores:
p, .aviso, p#rojo { … }

• Propiedades: valores
o Palabras claves (keywords): Identificadores predefinidos en CSS. Varios,
separados por espacios.
o Strings: Definir contenido HTML, rutas de fichero, fuentes…
o Medidas absolutas: No dependen de otras medidas o del entorno (resolución,
tamaño, etc). Para documentos físicos (pulgadas, cm, mm, pt).
o Medidas relativas: Sí dependen del entorno, en cada plataforma se visualiza
diferente. Para layouts en pantalla (px, %, em, ex).
o Números: Precedidos por + ó -.
o Colores: Colores específicos o RGB: rgb(128,128,128) – rgb(50%,50%,50%).
o URLs: Para incluir hojas de estilo o imágenes (background).

• Herencia y cascada:
o Si no se ha definido explícitamente ninguna regla: HERENCIA.
▪ Las propiedades de un padre se propagan a los hijos.
o Si se puede aplicar más de una regla: CASCADA.
▪ Determina cuál es el valor de una propiedad cuando varias
declaraciones entran en conflicto.
• Modelo de cajas: Margin, border, padding y content.
TEMA 4. JAVASCRIPT Y DOM
1. JavaScript
• Externo: <script type=”text/javascript” src=”fichero.js”> </script>
• Empotrado: <script type=”text/javascript”> … código … </script>
• Inline: como valor del atributo de un evento HTML.

2. Usos habituales
• Mejora del GUI.
• Animación.
• Reducir la carga del servidor.
• Mini-aplicaciones.
• Aplicaciones asíncronas.
• Muchos de los usos requieren DHTML (JS + HTML + CSS + DOM).

3. Generalidades
var age = parseInt(prompt(“…”, 29)); Pide una entrada por teclado al usuario; el segundo valor
(29) se muestra por defecto.

isNaN(): devuelve true si el argumento no se interpreta como un número.

alert(): muestra una caja de alerta con un mensaje.

confirm(): devuelve un booleano para indiciar si se ha seleccionado “OK” o “cancel”.

document.write(): coloca texto en el documento que se visualiza en la ventana del navegador.

- No se puede escribir contenido en el documento actual desde el código de un


manejador de eventos.
- Sólo puede usarse para escribir HTML en el documento actual conforme se vaya
procesando.
o Antes de que ocurra el evento -> entonces document.write() sobreescribirá el
contenido de la ventana actual.
o Debe usarse innerHTML o seleccionar un elemento para escribir en él tras
cargar el documento.

history.back(): devuelve al usuario al URL anterior del historial del navegador.

window.location = “…”: Contiene información sobre el URL de la página que se está


visualizando. Puede usarse para dirigir al navegador a otro URL.

• Lo más habitual es que el código JS se activa por eventos (event-driven).


• Las funciones se deben declarar en la parte <head>.
• Hay un flujo de control secuencial que recorre <body> del documento. Se ejecuta el
código a medida que se encuentra.

4. Formas de activar JavaScript


• Asociar manejadores de eventos: <body onload=”alert(‘…’)”>
• Desde un enlace usando un URL JS: <a href=”javascript: void TodaysMenu()”> … </a>
o Si no se indica el tipo a devolver, la función puede devolver una cadena p.ej.
• Uso de fechas:
o Crear objeto de tipo fecha: var today = new Date()
o Métodos aplicables: today.getDay()

5. Jerarquía de objetos

Document representa el HTML actual. Todos los aspectos del documento a los que se tiene
acceso mediante JS y DOM nivel 0 se representan como propiedades del objeto document.
P.ej. document.forms[1] referencia al segundo formulario definido en el doc. actual.

• elements[]: representa todos los componentes de un formulario (buttons, textareas,


radiobuttons, etc).

document.forms[0].elements[0].value = …

Se puede simplificar pasando el formulario como parámetro.

<body onload=”CalcRemaining(document.form[0])”>
<input type=”button” value=”Re-display clock” onclick=”CalcRemaining(this.form)”>

También seleccionando los elementos por su name en el input

function CalcRemaining(theForm) {


theForm.txtDays.value = days;

6. Acceso universal a partes del documento


document.getElementById(‘foo’) referencia al elemento HTML cuyo id tenga valor ‘foo’.

• document.getElementById(‘pageTitle’).innerHTML = “…” permite controlar su


contenido
• document.getElementById(‘update’).title = “…” permite acceder a los atributos de los
elementos.
document.getElementById(‘clock’).style.fontSize = “1.5em”;

También podría gustarte