Programación

Apuntes de Unidad 2.
EL LENGUAJE HTML.
Los lenguajes de etiquetas, también conocidos como lenguajes de marcado o de marcas, son los que nos permiten
estructurar un documento mediante el uso de etiquetas. A este tipo pertenece HTML. Los lenguajes de etiquetas no se
identifican con los de programación; esto ocurre principalmente porque los lenguajes de etiquetas no definen algunos
aspectos básicos presentes en los lenguajes de programación, como es el caso de funciones aritméticas o el uso de
variables, por citar algunos ejemplos.
Es importante mencionar que HTML se apoyó en SGML para su definición, sin basarse en el marcado estricto. El
Standard Generalized Markup Language, o simplemente conocido como SGML, es un estándar ISO (Organización
Internacional de Normalización, del nombre original en inglés, International Organization for Standardization) que permite
definir lenguajes de etiquetas. Es estándar ISO desde 1986 (ISO 8879:1986). Una de las características más valoradas
de SGML es la de permitir el intercambio de información de una manera sencilla, abstrayéndose de la complejidad de la
aplicación. De SGML también surgió XML (Extensible Markup Language, Lenguaje de Marcación Extensible), el cual es
usado en la actual facturación electrónica a partir del año 2014 en México.
HTML (HyperText Markup Language o lenguaje de marcado de hipertexto) es el lenguaje de etiquetas que funciona
como una de las piedras angulares de la WWW. Aparece en los primeros años de la década de los noventa y en el año
1993, se logran dar algunos pasos muy importantes, como la incorporación de etiquetas para imágenes, tablas y
formularios. En 1995, llegaría HTML 2.0, que sería la primera versión en convertirse en estándar. En 1996, la
estandarización de HTML pasa a manos del W3C y, en 1997, llega la recomendación conocida como HTML 3.2. Entre
los años 1997 y 1998, surge HTML 4, un paso importante en esta evolución. Luego llegaría el momento de HTML en su
versión 4.01, que es publicado como una recomendación de la W3C a fines del año 1999 y que se trata del estándar que
más duró, aunque desde el 2004 empezó el desarrollo de HTML 5.
La evolución de HTML5 tuvo ya bastantes momentos destacados. Comenzando por la creación de su grupo de trabajo
WHAT, conformado por miembros de Apple, Mozilla y Opera, hasta llegar al prometedor 2013, en el que se esperaba
que mil millones de sitios adoptaran el lenguaje y que ya salieran a la venta smartphones con soporte HTML5.
Entre los puntos más destacados, están el de la primera versión publicada de HTML5 y la compatibilidad con Firefox 3
en el 2008, la presentación del reproductor HTML5 opcional por parte de YouTube en el 2010, el palazo de Steve Jobs
contra Flash también en el 2010, el cambio de los documentos de Scribd a HTML5 y el Stop puesto por Adobe en lo que
respecta a soporte de Flash para dispositivos móviles.
Existen también un grupo de grandes sitios que aún no se amigan con HTML5, entre los cuales está Craiglist, eBay,
Wikipedia,y la homepage de WordPress.
ETIQUETAS, SINTAXIS, ESTRUCTURA Y CARACTERÍSTICAS.
Entre las características más importantes de HTML, destacamos que los elementos se representan en el código con
etiquetas (también llamadas tags o marcas), las cuales se encierran mediante los símbolos menor (<) y mayor (>) y, a su
vez, pueden tener atributos definidos en forma específica. En su estructura básica, vemos que un documento HTML
tiene una primera línea de declaración de tipo de documento, un encabezado (<head>) y posteriormente un cuerpo
(<body>). En el encabezado, encontramos los elementos que describen el documento, como por ejemplo el título, y
también etiquetas de metadatos (metadata) que pueden contener descripción, nombre del autor e idioma, entre otras
opciones. También, en el encabezado, se suelen especificar los archivos que se incluyen o anexan al documento, como
por ejemplo hojas de estilo o scripts que se ejecutan en la página del lado cliente. En el cuerpo del documento, se
definen los elementos que se representan en la pantalla del navegador. La mayoría de estos elementos poseen una
apariencia predeterminada por defecto que, en algunos casos, puede tener alguna variación según el navegador. Si bien
HTML permite definir algunas características de representación, como color y tamaño, no es recomendable utilizarlas ya
que, para esta labor, contamos con las hojas de estilo, más conocidas como CSS. La función de HTML es definir la
estructura del documento, dejando de lado lo que se relaciona con representación. A la hora de diseñar y desarrollar
nuestros proyectos, será muy importante pensar en cómo llevaremos adelante esa estructura antes de sentarnos a
escribir las líneas de código que la conformarán. El código HTML puede ser editado con cualquier editor de texto plano,
que permite crear y modificar archivos digitales compuestos únicamente por texto sin formato, como por ejemplo el Bloc
de notas de Windows.
Así pues la estructura básica de HTML se puede considerar como la siguiente:
<html>
<head>
<title>MI PRIMERA PAGINA</title>
</head>
<body bgcolor="yellow">
<font color="#000066" size="5">Estoy realizando mi primera página Web.</font>
</body>
</html>
Este código nos permitirá mostrar en un navegador una página sencilla como se observa:
Cabe hacer destacar las etiquetas:
ETIQUETA FUNCIÓN
<HTML> Empieza un documento HTML
<HEAD> Zona de cabecera
<TITLE> Zona de título
</TITLE> Termina zona de título
</HEAD> Termina zona de cabecera
<BODY> Zona de cuerpo del documento
</BODY> Termina zona de cuerpo del
documento
</HTML> Termina documento HTML
CARACTERES ESPECIALES.
Existe una razón evidente que impide que podamos escribir ciertos símbolos directamente en un texto HTML, como por
ejemplo el signo “menor que” (<), dichos símbolos tienen un significado en HTML y es necesario diferenciar claramente
cuándo poseen ese significado y cuándo queremos que aparezcan literalmente en el documento final. Por ejemplo, como
ya sabemos, < indica el comienzo de una directiva, y, por ello, si queremos que aparezca en el texto como tal tendremos
que dar un rodeo escribiendo algo que no dé lugar a confusión, en este caso <. Los símbolos afectados por esta
limitación y la forma de escribirlos, se detallan a continuación:
< (Menor que): <

>(Mayor que): >
& (símbolo de and, o ampersand): &
" (comillas dobles): "
Es decir, que para escribir <"hola"> en nuestro texto HTML original debemos poner: <"hola">
El otro caso especial se da cuando en un texto HTML se quiere escribir una eñe, por ejemplo. Existe una forma fácil de
hacerlo, que consiste en utilizar códigos como las que antes se presentaron para escribir ciertos símbolos. Los códigos
comienzan siempre con el símbolo &, y terminan con un punto y coma (;). Entre medias va un identificador del carácter
que queremos que se escriba. Los códigos necesarios en nuestro idioma son:
á: á Á: Á ¡: ¡

é: é É: É !: !
í: í Í: Í <: <
ó: ó Ó: Ó >: >
ú: ú Ú: Ú &: &
ü: ü Ü: Ü ": "
ñ: ñ Ñ: Ñ @: @
¿: ¿ ?: ? :
Por lo tanto la palabra página la podríamos escribir como:

página
página
Otro ejemplo: ¿En qué año estamos?

Sería escrito como: ¿En qué año estamos?
Es por ello que si deseamos que cualquier visor de páginas Web pueda visualizar las letras acentuadas de nuestro
documento debemos utilizar sus correspondientes códigos para representarlas.
CÓDIGO EN HTML PARA LOS MARCOS (FRAMES).
Usando marcos usted puede dividir la ventana que muestra las páginas de HTML en varias partes. De modo que así
usted posee partes individuales en su browser y en cada parte puede cargar páginas diferentes. Algo interesante es que
estos frames pueden interactuar. Esto significa que pueden intercambiar información el uno con el otro. Por ejemplo
usted puede crear dos frames, uno con su página normal de HTML y otra con una barra de herramientas, la barra de
herramientas puede contener botones para navegar por su página normal de HTML. Esta barra de herramientas estará
siempre visible mientras usted navega por otros sitios de la página principal.
<HTML>
<HEAD>
<title>Frames</title>
</HEAD>
<FRAMESET ROWS="50%,50%">
<FRAME SRC="frtest1.html" name="fr1">
<FRAME SRC="frtest2.html" name="fr2">
</FRAMESET>
</HTML>
Primero usted le dice al browser cuantos frames quiere tener. Esto está definido en el tag <frameset...>. Escribiendo
rows el browser dividirá el espacio descrito en barras. Se pueden crear varias columnas usando cols en lugar de rows.
Se pueden usar varios tags <frameset...>. Aquí va un ejemplo distribuido por Netscape:
<FRAMESET COLS="50%,50%">
<FRAMESET ROWS="50%,50%">
<FRAME SRC="cell.html">
</FRAMESET>
<FRAMESET ROWS="33%,33%,33%">
</FRAMESET>
</FRAMESET>
Esto creará dos columnas y la segunda columna es dividida en 3 partes iguales. Los 50%,50% en el primer tag
<frameset> le dicen al browser que tan grandes serán los frames. Usted le puede dar nombres a sus frames. Esto es
muy importante para el uso con JavaScript. En el primer ejemplo puede ver como los frames toman sus nombres.
Usando el tag <frame> se le dice al browser que página de HTML cargar.
JAVASCRIPT
Introducción
JavaScript es un lenguaje creado por Netscape con el objetivo de integrarse con HTML y empleado fundamentalmente
en el desarrollo de páginas web dinámicas o interactivas. Está orientado a objetos y diseñado para el desarrollo de
aplicaciones cliente-servidor a través de los navegadores de Internet.
El código de programa de JavaScript es llamado script y no necesita ser compilado, ya que el propio navegador se
encarga de traducir dicho código. Gracias a JavaScript se pueden desarrollar programas que se ejecuten directamente
en el navegador (cliente) sin necesidad de acceder al servidor web de la página que visitamos. Lo anterior con la
finalidad de efectuar operaciones o tomar decisiones como: reconocer y responder a eventos de usuario, facilitar la
navegación en el sitio web, verificar los datos de los formularios, manipular capas, crear animaciones, desarrollar
multimedia, cambiar colores, etc. No todos los navegadores soportan JavaScript del mismo modo pero si es soportado.
La primera versión de JavaScript 1.0 fue un completo éxito y Microsoft introdujo un clon, denominado JScript, en la
versión 3.0 del Internet Explorer. Al día de hoy, siguen habiendo muchas diferencias y para solucionarlo han surgido
muchos productos como los Frameworks JavaScript, que ayudan a realizar funcionalidades avanzadas de DHTML sin
tener que preocuparse en hacer versiones distintas de los scripts, para cada uno de los navegadores posibles del
mercado.
Que quede claro que JavaScript no tiene nada que ver con Java.
Código JavaScript en un documento HTML
Los códigos JavaScript se pueden colocar en la cabecera o en el cuerpo del documento.

Hay tres formas de incorporar scripts al HTML:
1) Usando la etiqueta <SCRIPT LANGUAGE=”JavaScript”> para definir el inicio y finalizando con </SCRIPT>.
2) Como respuesta a eventos en la forma <ETIQUETA Nombre_Evento=”Código_JavaScript”>.
3) Escribiendo todo el código JavaScript en un archivo de texto independiente, sin las etiquetas <SCRIPT> y
</SCRIPT>, guardándolo con la extensión *.JS y llamándolo para su ejecución con la siguiente etiqueta:
<SCRIPT LANGUAGE=”JavaScript” SRC=”Archivo.js”> </SCRIPT>.
Esta última forma de incrustar código JavaScript, es la más cómoda y la más fácil de mantener.
Además existen también las etiquetas <NOSCRIPT> y </NOSCRIPT>, entre ellas se especificará una opción alternativa
para aquellos navegadores que no soportan o tienen bloqueado los scripts. Por ejemplo un texto diciendo: “Su
navegador no soporta JavaScript”.
Otro detalle importante resulta ser que cuando un navegador no soporta JavaScript, las etiquetas <SCRIPT> y
</SCRIPT> son ignoradas y se presenta el código script en pantalla interpretándolo como texto. La solución a esto
consiste en englobar el código JavaScript dentro de una etiqueta HTML de comentario, así los navegadores que no
soportan el lenguaje interpretaran el código como un comentario y no lo mostraran en pantalla.
Generalidades
1) Es "Case Sensitive", es decir, distingue mayúsculas de minúsculas.

2) En los nombres con más de una palabra, se iniciará con mayúscula la primer letra de la segunda palabra.
3) Comentarios: /* ... */ para encerrar un bloque y // para comentarios de una línea.
4) Cada sentencia ha de terminar en punto y coma. Tanto para sentencias que se encuentran en una misma línea o para
una que ocupa varias líneas.
5) Encerrando código entre llaves { ... } lo agrupamos. Esto es útil cuando usamos estructuras de control.
Variables
Es un lenguaje débilmente tipado, esto es, se puede declarar una variable que ahora sea un entero y más adelante una
cadena. Es decir, se consideran indefinidas Para declarar variables hay que poner la palabra var y a continuación el
nombre de la variable o la lista de variables separadas por comas. Tenemos libertad para declarar o no las variables con
la palabra var, pero si no la utilizamos para declararlas, éstas serán globales a toda la página, sea cual sea el ámbito en
el que hayan sido declaradas y podemos cometer errores y pérdida de datos. No todos los nombres de variable son
válidos, hay limitantes:
• Un nombre válido de variable no puede tener espacios.

• Puede estar formada por números, letras y el guion bajo.
• No se puede usar palabras reservadas.
• No puede empezar con un número, es decir, el primer caracter debe de ser una letra o el guion bajo.
Las variables tienen un ámbito, unas zonas del script donde son visibles y utilizables; en JavaScript una variable puede
ser de ámbito:
1) Global: se puede usar en cualquier punto del código de una página y se declara en la cabecera, <HEAD> ... </HEAD>.
2) Local: se declara y utiliza sólo dentro de una función o también en otro ámbito como puede ser un bucle. En general,
son ámbitos locales cualquier lugar acotado por llaves. No hay problema en declarar una variable local con el mismo
nombre que una global, en este caso la variable global será visible desde toda la página, excepto en el ámbito donde
está declarada la variable local ya que en este sitio ese nombre de variable está ocupado por la local y es ella quien
tiene validez. Pese a esto, se aconseja no usar nombres repetidos de variables para evitar confusiones.
Tipos de Datos
Los tipos de datos que maneja JavaScript son:
1) Cadena de texto o caracteres (string): aquellos que contienen texto delimitado entre comillas dobles o
sencillas, con cualquier caracter incluyendo el nulo (null).
2) Numéricos: aquellos que contienen números enteros (en base 10, 8, ó 16) o reales (de punto flotante). Para
escribir un número en hexadecimal debemos escribirlo precedido de un cero y una equis, por ejemplo 0x3EF.
3) Booleanos o Lógicos: aquellos con los valores true o false.
Secuencias o Caracteres de escape en cadenas de texto
Hay una serie de caracteres especiales que sirven para expresar en una cadena de texto determinados controles como
puede ser un salto de línea o un tabulador. Estos son los caracteres de escape y se escriben con una notación especial
que comienza por una diagonal invertida (\) y luego se coloca el código del carácter a mostrar. A continuación la tabla
con todos los caracteres de escape:
Descripción Carácter de escape

Salto de línea \n
Comilla simple \'
Comilla doble \"
Tabulador vertical \v
Tabulador horizontal \t
Retorno de carro \r
Avance de página \f
Retroceder espacio \b
Diagonal invertida \\
Palabras Reservadas
JavaScript tiene una serie de términos reservados que no pueden ser empleados para nombrar variables, funciones,
objetos y métodos. Estas palabras se consideran escritas en minúsculas y aquí presentamos algunas:
abstract boolean Break byte

case catch Char class
const continue Default do
double else Extends false
final finally Float for
function goto Int implements
input In Instanceof interface
long native New null
package private protected public
return short static super
switch synchronized this throw
throws transient true try
var Val while with
Constantes
Son variables que no cambian de valor. Se indican anteponiendo la sentencia const al nombre de la variable, si no el
sistema creerá que se trata de una variable. Además no pueden ser redefinidas en un mismo script.
Operadores
Permiten combinar diferentes valores en una expresión y se dividen en varios grupos en base a la operación que
realicen. Además, Para marcar unas pautas en la evaluación de las sentencias y que estas se ejecuten siempre igual y
con sentido común existe la precedencia de operadores, que no es más que el orden por el que se irán ejecutando las
operaciones que ellos representan. En un principio todos los operadores se evalúan de izquierda a derecha, pero existen
unas normas adicionales, por las que determinados operadores se evalúan antes que otros.
Dichas reglas de precedencia las podemos ver a continuación después de la clasificación de los operadores:
ARITMETICOS LOGICOS DE COMPARACION

+ Suma && AND ('y' lógica) == Igualdad
- Resta || OR ('o' lógica) != No Igualdad
* Multiplicación ! NOT ('no' lógica) === Igualdad estricta
/ División !== No Igualdad estricta
% Módulo > Mayor que
++ Incremento CONDICIONALES < Menor que
-- Decremento (condición) ? valor1 : valor2 >= Mayor o Igual que
- Negación <= Menor o Igual que
DE BIT A BIT DE ASIGNACION ESPECIALES

~ Not == Igualdad delete
<< Desplazamiento izquierda += Adición in
>> Desplazamiento derecha -= I Sustracción instanceof
& And lógico binario *= Multiplicación new
| Or lógico binario /= División this
^ Xor lógico binario %= Módulo typeof
<= Menor o Igual que >>= Desplazamiento derecha void
<<= Desplazamiento izquierda
>>>= Desplazamiento derch sin signo
&= Operador de bits And
^= Operador de bits Xor
|= Operador de bits Or
Nota: El símbolo de suma (+) aplicado a cadenas de caracteres produce la concatenación. Faltan muchas operaciones
típicas a realizar con cadenas, para las cuales no existen operadores. Es porque esas funcionalidades se obtienen a
través de la clase String de JavaScript.
Reglas de precedencia
Muchas de estas reglas de precedencia están sacadas de las matemáticas y son comunes a otros lenguajes, las tenemos
en seguida:
() [] . Paréntesis, corchetes y el operador punto que sirve para los objetos

! - ++ -- negación, negativo, incrementos y decrementos
* / % Multiplicación división y módulo
+- Suma y resta
<< >> >>> Cambios a nivel de bit
< <= > >= Operadores condicionales
== != Operadores condicionales de igualdad y desigualdad
& ^ | Lógicos a nivel de bit
&& || Lógicos boleanos
= += -= *= /= %= <<= >>= >>>= &= ^= != Asignación
Control de tipos
Para comprobar el tipo de un dato se puede utilizar otro operador que está disponible a partir de JavaScript 1.1, el
operador typeof, que devuelve una cadena de texto que describe el tipo del operador que estamos comprobando.
Nota: a lo largo de nuestra experiencia con JavaScript veremos que muchas veces es más útil cambiar el tipo de dato de
una variable antes de hacer una comprobación con tipeof para ver si la podemos utilizar como operando. Existen diversas
funciones para intentar cambiar el tipo de una variable, como parseInt().
De modo que los distintos tipos de las variables podrían ser:

• boolean, para los datos boleanos. (True o false)
• number, para los numéricos.
• string, para las cadenas de caracteres.
• object, para los objetos.
Queremos destacar tan sólo dos detalles más:

1) Los números, ya tengan o no parte decimal, son siempre del tipo de datos numérico.
2) Una de las variables es un poco más compleja, es la variable fecha que es un objeto de la clase Date(), que se utiliza
para el manejo de fechas en los scripts.
Estructuras de Control
-Toma de decisiones: 1) if 2) if… else 3) switch

-Ciclos o bucles: 1) for 2) while 3) do while
Instrucciones break y continue
break: Significa detener la ejecución de un bucle y salirse de él.

continue: Sirve para detener la iteración actual y volver al principio del bucle para realizar otra iteración, si corresponde.
Bucles anidados
Anidar un bucle consiste en meter ese bucle dentro de otro. La anidación de bucles es necesaria para hacer
determinados procesamientos un poco más complejos. Veamos un ejemplo, se trata de imprimir en la página las todas
las tablas de multiplicar. Del 1 al 9, es decir, la tabla del 1, la del 2, del 3, etc.
for (i=1;i<10;i++){
document.write ("<br><b>La tabla del " + i + ":</b><br>")
for (j=1;j<10;j++) {
document.write (i + " x " + j + ": ")
document.write (i*j)
document.write ("<br>")
}
}
Con el primer bucle controlamos la tabla actual y con el segundo bucle la desarrollamos. En el primer bucle escribimos
una cabecera, en negrita, indicando la tabla que estamos escribiendo, primero la del 1 y luego las demás en orden
ascendente hasta el 9. Con el segundo bucle escribo cada uno de los valores de cada tabla.
Funciones en JavaScript
Podemos definir una función como una serie de instrucciones que englobamos dentro de un mismo proceso. Este
proceso se podrá luego ejecutar desde cualquier otro sitio de la página con solo llamarlo. Por ejemplo, en una página
web puede haber una función para cambiar el color del fondo y desde cualquier punto de la página podríamos llamarla
para que nos cambie el color cuando lo deseemos. Las funciones se utilizan constantemente, no sólo las que uno
escribe, sino también las que ya están definidas en el lenguaje.
Una función se debe definir con una sintaxis especial que vamos a conocer a continuación.
function nombrefuncion (){

instrucciones de la función
...
}
Primero se escribe la palabra function, reservada para este uso. Seguidamente se escribe el nombre de la función, que
como los nombres de variables puede tener números, letras y algún carácter adicional como en guion bajo. A
continuación se colocan entre llaves las distintas instrucciones de la función. Las llaves en el caso de las funciones no
son opcionales, además es útil colocarlas siempre como se ve en el ejemplo, para que se reconozca fácilmente la
estructura de instrucciones que engloba la función. Para ejecutar la función utilizamos su nombre seguido de los
paréntesis.
En principio, podemos colocar las funciones en cualquier parte de la página, siempre entre etiquetas <SCRIPT>, claro
está. No obstante existe una limitación a la hora de colocarla con relación a los lugares desde donde se la llame.
Existen dos opciones posibles para colocar el código de una función:
a) Colocar la función en el mismo bloque de script: En concreto, la función se puede definir en el bloque <SCRIPT>
donde esté la llamada a la función, aunque es indiferente si la llamada se encuentra antes o después del código de la
función, dentro del mismo bloque <SCRIPT>.
<SCRIPT>
miFuncion()
function miFuncion(){
//hago algo...
document.write("Esto va bien")
}
</SCRIPT>
Este ejemplo funciona correctamente porque la función está declarada en el mismo bloque que su llamada.
b) Colocar la función en otro bloque de script: También es válido que la función se encuentre en un bloque
<SCRIPT>anterior al bloque donde está la llamada.
<HTML>
<HEAD>
<TITLE>MI PÁGINA</TITLE>
<SCRIPT>
function miFuncion(){
//hago algo...
document.write("Esto va bien")
}
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT>
miFuncion()
</SCRIPT>
</BODY>
</HTML>
Parámetros de las Funciones
Los parámetros se usan para mandar valores a las funciones. Una función trabajará con los parámetros para realizar las
acciones. Por decirlo de otra manera, los parámetros son los valores de entrada que recibe una función. Para definir en
la función un parámetro tenemos que poner el nombre de la variable que va a almacenar el dato que le pasemos. Esa
variable tendrá como valor el dato que le pasemos a la función cuando la llamemos. Además, la variable donde
recibimos el parámetro tendrá vida durante la ejecución de la función y dejará de existir cuando la función termine su
ejecución. Por ejemplo si definimos la función:
function escribirBienvenida(nombre){
document.write ("<H1>Hola " + nombre + "</H1>")
}
Entonces para llamar a la función de este ejemplo pondríamos:
EscribirBienvenida ("Alberto García")
Al llamar a la función así, el parámetro nombre toma como valor "Alberto García" y al escribir el saludo por pantalla
escribirá "Hola Alberto García" entre etiquetas <H1>.
Los parámetros pueden recibir cualquier tipo de datos, numérico, textual, booleano o un objeto. Realmente no
especificamos el tipo del parámetro, por eso debemos tener un cuidado especial al definir las acciones que realizamos
dentro de la función y al pasarle valores, para asegurarnos que todo es consecuente con los tipos de datos que
esperamos tengan nuestras variables o parámetros. Además, una función puede recibir tantos parámetros como
queramos y para expresarlo se colocan los nombres de los parámetros separados por comas, dentro de los paréntesis.
Veamos un ejemplo donde se reciben 2 parámetros:
function escribirBienvenida (nombre,colorTexto){

document.write ("<FONT color='" + colorTexto + "'>")
document.write ("<H1>Hola " + nombre + "</H1>")
document.write ("</FONT>")
}
Llamaríamos a la función con esta sintaxis. Entre los paréntesis colocaremos los valores de los parámetros:
var miNombre = "Pepe"

var miColor = "red"
escribirBienvenida (miNombre,miColor)
He colocado entre los paréntesis dos variables en lugar de dos textos entrecomillados. Cuando colocamos variables
entre los parámetros en realidad lo que estamos pasando a la función son los valores que contienen las variables y no
las mismas variables.
Tenemos que saber que los parámetros de las funciones se pasan por valor. Esto quiere decir que estamos pasando
valores y no variables. En la práctica, aunque modifiquemos un parámetro en una función, la variable original que
habíamos pasado no cambiará su valor.
Devolución de valores en las funciones
Las funciones en JavaScript también pueden retornar valores. De hecho, ésta es una de las utilidades más esenciales de
las funciones, que debemos conocer, no sólo en JavaScript sino en general en cualquier lenguaje de programación. De
modo que, al invocar una función, se podrá realizar acciones y ofrecer un valor como salida.
Veamos un ejemplo de función que calcula la media de dos números. La función recibirá los dos números y retornará el
valor de la media.
function media(valor1,valor2){
var resultado
resultado = (valor1 + valor2) / 2
return resultado
}
Para especificar el valor que retornará la función se utiliza la palabra return seguida del valor que se desea devolver. En
este caso se devuelve el contenido de la variable resultado, que contiene la media calculada de los dos números. Quizás
nos preguntemos ahora cómo recibir un dato que devuelve una función. Realmente en el código fuente de nuestros
programas podemos invocar a las funciones en el lugar que deseemos. Cuando una función devuelve un valor
simplemente se sustituye la llamada a la función por ese valor que devuelve. Así pues, para almacenar un valor de
devolución de una función, tenemos que asignar la llamada a esa función como contenido en una variable, y eso lo
haríamos con el operador de asignación =.
Para ilustrar esto se puede ver este ejemplo, que llamará a la función media() y guardará el resultado de la media en una
variable para luego imprimirla en la página.
var miMedia
miMedia = media(12,8)
document.write (miMedia)
Múltiples return
En realidad en JavaScript las funciones sólo pueden devolver un valor, por lo que en principio no podemos hacer
funciones que devuelvan dos datos distintos. Ahora bien, aunque sólo podamos devolver un dato, en una misma función
podemos colocar más de un return. Como decimos, sólo vamos a poder retornar una cosa, pero dependiendo de lo que
haya sucedido en la función podrá ser de un tipo u otro, con unos datos u otros.
En esta función podemos ver un ejemplo de utilización de múltiples return. Se trata de una función que devuelve un 0 si
el parámetro recibido era par y el valor del parámetro si este era impar.
function multipleReturn(numero){
var resto = numero % 2
if (resto == 0)
return 0
else
return numero
}
Para averiguar si un número es par hallamos el resto de la división al dividirlo entre 2. Si el resto es cero es que era par y
devolvemos un 0, en caso contrario -el número es impar- devolvemos el parámetro recibido.
Ámbito de las variables en las funciones
Dentro de las funciones podemos declarar variables. Sobre este asunto debemos de saber que todas las variables
declaradas en una función son locales a esa función, es decir, sólo tendrán validez durante la ejecución de la función.
Podría darse el caso de que podemos declarar variables en funciones que tengan el mismo nombre que una variable
global a la página. Entonces, dentro de la función, la variable que tendrá validez es la variable local y fuera de la función
tendrá validez la variable global a la página.
En cambio, si no declaramos las variables en las funciones se entenderá por JavaScript que estamos haciendo
referencia a una variable global a la página, de modo que si no está creada la variable la crea, pero siempre global a la
página en lugar de local a la función.
HOJAS DE ESTILO EN CASCADA (CASCADING STYLE SHEETS, CSS)
- Introducción
CSS es un lenguaje de hojas de estilos creado para controlar el aspecto o presentación de los documentos electrónicos
definidos con HTML y XHTML. CSS es la mejor forma de separar los contenidos y su presentación y es imprescindible
para crear páginas web complejas.
Separar la definición de los contenidos y la definición de su aspecto presenta numerosas ventajas, ya que obliga a crear
documentos HTML/XHTML bien definidos y con significado completo (también llamados "documentos semánticos").
Además, mejora la accesibilidad del documento, reduce la complejidad de su mantenimiento y permite visualizar el
mismo documento en infinidad de dispositivos diferentes.
Al crear una página web, se utiliza en primer lugar el lenguaje HTML/XHTML para marcar los contenidos, es decir, para
designar la función de cada elemento dentro de la página: párrafo, titular, texto destacado, tabla, lista de elementos, etc.
Una vez creados los contenidos, se utiliza el lenguaje CSS para definir el aspecto de cada elemento: color, tamaño y tipo
de letra del texto, separación horizontal y vertical entre elementos, posición de cada elemento dentro de la página, etc.
Las hojas de estilos aparecieron poco después que el lenguaje de etiquetas SGML, alrededor del año 1970. Desde la
creación de SGML, se observó la necesidad de definir un mecanismo que permitiera aplicar de forma consistente
diferentes estilos a los documentos electrónicos. El organismo W3C (World Wide Web Consortium), encargado de crear
todos los estándares relacionados con la web, propuso la creación de un lenguaje de hojas de estilos específico para el
lenguaje HTML y se presentaron nueve propuestas. Las dos propuestas que se tuvieron en cuenta fueron la CHSS
(Cascading HTML Style Sheets) y la SSP (Stream-based Style Sheet Proposal). La propuesta CHSS fue realizada por
Håkon Wium Lie y SSP fue propuesto por Bert Bos. Entre finales de 1994 y 1995 Lie y Bos se unieron para definir un
nuevo lenguaje que tomaba lo mejor de cada propuesta y lo llamaron CSS (Cascading Style Sheets).
A finales de 1996, el W3C publicó la primera recomendación oficial, conocida como "CSS nivel 1".
El 12 de Mayo de 1998, el grupo de trabajo de CSS publica su segunda recomendación oficial, conocida como "CSS
nivel 2".
La siguiente recomendación de CSS, conocida como "CSS nivel 3", es publicada en Abril de 2015 y es la más actual.
- Funcionamiento básico de CSS
Antes de que se generalizara el uso de CSS, los diseñadores de páginas web utilizaban etiquetas HTML especiales para
modificar el aspecto de los elementos de la página. Hacerlo así implica demasiado trabajo porque hay que ir aplicando
una excesiva cantidad de etiquetas. Como el diseño de los sitios web está en constante evolución, es habitual modificar
cada cierto tiempo el aspecto de las páginas del sitio. Por lo tanto, cambiar el aspecto del sitio requeriría modificar miles
de etiquetas y millones de atributos.
- Cómo incluir CSS en un documento HTML
Existen tres opciones para incluir CSS:
1) Incluir CSS en el mismo documento HTML.

Los estilos se definen en una zona específica del propio documento HTML. Se emplea la etiqueta <style> de HTML y
solamente se pueden incluir en la cabecera del documento (sólo dentro de la sección <head>). Este método se emplea
cuando se define un número pequeño de estilos o cuando se quieren incluir estilos específicos en una determinada
página HTML que completen los estilos que se incluyen por defecto en todas las páginas del sitio web. El principal
inconveniente es que si se quiere hacer una modificación en los estilos definidos, es necesario modificar todas las
páginas que incluyen el estilo que se va a modificar.
Observe el ejemplo siguiente, en la página HTML se enlaza el archivo CSS externo mediante la etiqueta <link>:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejemplo de estilos CSS en un archivo externo</title>
<link rel="stylesheet" type="text/css" href="/css/estilos.css" media="screen" />
</head>
<body>
<p>Un párrafo de texto.</p>
</body>
</html>
2) Definir CSS en un archivo externo

En este caso, todos los estilos CSS se incluyen en un archivo de tipo CSS que las páginas HTML enlazan mediante la
etiqueta <link>. Un archivo de tipo CSS no es más que un archivo simple de texto cuya extensión es .css Se pueden
crear todos los archivos CSS que sean necesarios y cada página HTML puede enlazar tantos archivos CSS como
necesite.
Normalmente, la etiqueta <link> incluye cuatro atributos cuando enlaza un archivo CSS:
rel: indica el tipo de relación que existe entre el recurso enlazado (en este caso, el archivo CSS) y la página HTML. Para
los archivos CSS, siempre se utiliza el valor stylesheet
type: indica el tipo de recurso enlazado. Sus valores están estandarizados y para los archivos CSS su valor siempre es
text/css
href: indica la URL del archivo CSS que contiene los estilos. La URL indicada puede ser relativa o absoluta y puede
apuntar a un recurso interno o externo al sitio web.
media: indica el medio en el que se van a aplicar los estilos del archivo CSS. Más adelante se explican en detalle los
medios CSS y su funcionamiento.
De todas las formas de incluir CSS en las páginas HTML, esta es la más utilizada con mucha diferencia. La principal
ventaja es que se puede incluir un mismo archivo CSS en multitud de páginas HTML, por lo que se garantiza la
aplicación homogénea de los mismos estilos a todas las páginas que forman un sitio web.
Con este método, el mantenimiento del sitio web se simplifica al máximo, ya que un solo cambio en un solo archivo CSS
permite variar de forma instantánea los estilos de todas las páginas HTML que enlazan ese archivo.
Aunque generalmente se emplea la etiqueta <link> para enlazar los archivos CSS externos, también se puede utilizar la
etiqueta <style>.
La forma alternativa de incluir un archivo CSS externo se muestra a continuación:

<head>
<title>Ejemplo de estilos CSS en un archivo externo</title>
<style type="text/css" media="screen">
@import '/css/estilos.css';
</style>
</head>
<body>
<p>Un párrafo de texto.</p>
</body>
</html>
En este caso, para incluir en la página HTML los estilos definidos en archivos CSS externos se utiliza una regla especial
de tipo @import. Las reglas de tipo @import siempre preceden a cualquier otra regla CSS (con la única excepción de la
regla @charset).
La URL del archivo CSS externo se indica mediante una cadena de texto encerrada con comillas simples o dobles o
mediante la palabra reservada url(). De esta forma, las siguientes reglas @import son equivalentes:
@import '/css/estilos.css';
@import "/css/estilos.css";
@import url('/css/estilos.css');
@import url("/css/estilos.css");
3) Incluir CSS en los elementos HTML
El último método para incluir estilos CSS en documentos HTML es el peor y el menos utilizado, ya que tiene los mismos
problemas que la utilización de las etiquetas <font>.
Ejemplo:

<head>
<title>Ejemplo de estilos CSS en el propio documento</title>
</head>
<body>
<p style="color: black; font-family: Verdana;">Un párrafo de texto.</p>
</body>
</html>
Esta forma de incluir CSS directamente en los elementos HTML solamente se utiliza en determinadas situaciones en las
que se debe incluir un estilo muy específico para un solo elemento concreto.
- Glosario Básico CSS
CSS define una serie de términos que permiten describir cada una de las partes que componen los estilos CSS. El
siguiente esquema muestra las partes que forman un estilo CSS muy básico:
Figura 1.1 Componentes de un estilo CSS básico
- Componentes de un estilo CSS básico
Los diferentes términos se definen a continuación:

Regla: cada uno de los estilos que componen una hoja de estilos CSS. Cada regla está compuesta de una parte de
"selectores", un símbolo de "llave de apertura" ({), otra parte denominada "declaración" y por último, un símbolo de "llave
de cierre" (}).
Selector: indica el elemento o elementos HTML a los que se aplica la regla CSS.
Declaración: especifica los estilos que se aplican a los elementos. Está compuesta por una o más propiedades CSS.
Propiedad: característica que se modifica en el elemento seleccionado, como por ejemplo su tamaño de letra, su color
de fondo, etc.
Valor: establece el nuevo valor de la característica modificada en el elemento.
Un archivo CSS puede contener un número ilimitado de reglas CSS, cada regla se puede aplicar a varios selectores
diferentes y cada declaración puede incluir tantos pares propiedad/valor como se desee.
El estándar CSS 2.1 define 115 propiedades, cada una con su propia lista de valores permitidos. Por su parte, los
últimos borradores del estándar CSS 3 ya incluyen 239 propiedades.
- Medios CSS
Una de las características más importantes de las hojas de estilos CSS es que permiten definir diferentes estilos para
diferentes medios o dispositivos: pantallas, impresoras, móviles, proyectores, etc.
Además, CSS define algunas propiedades específicamente para determinados medios, como por ejemplo la paginación
y los saltos de página para los medios impresos o el volumen y tipo de voz para los medios de audio. La siguiente tabla
muestra el nombre que CSS utiliza para identificar cada medio y su descripción:
Medio Descripción
All Todos los medios definidos
Braille Dispositivos táctiles que emplean el sistema braille
Embosed Impresoras braille
Handheld Dispositivos de mano: móviles, PDA, etc.
Print Impresoras y navegadores en el modo"Vista Previa para Imprimir"
Projection Proyectores y dispositivos para presentaciones
Screen Pantallas de ordenador
Speech Sintetizadores para navegadores de voz utilizados por personas discapacitadas
Tty Dispositivos textuales limitados como teletipos y terminales de texto
Tv Televisores y dispositivos con resolución baja
Los medios más utilizados actualmente son screen (para definir el aspecto de la página en pantalla) y print (para definir
el aspecto de la página cuando se imprime), seguidos de handheld (que define el aspecto de la página cuando se
visualiza mediante un dispositivo móvil).
- Comentarios
CSS permite incluir comentarios entre sus reglas y estilos. Los comentarios son contenidos de texto que el diseñador
incluye en el archivo CSS para su propia información y utilidad. Los navegadores ignoran por completo cualquier
comentario de los archivos CSS, por lo que es común utilizarlos para estructurar de forma clara los archivos CSS
complejos. El comienzo de un comentario se indica mediante los caracteres /* y el final del comentario se indica
mediante */, tal y como se muestra en el siguiente ejemplo:
/* Este es un comentario en CSS */
Los comentarios pueden ocupar tantas líneas como sea necesario, pero no se puede incluir un comentario dentro de otro
comentario.
- Sintaxis de la definición de cada propiedad CSS
Una de las principales informaciones de cada definición es la lista de posibles valores que admite la propiedad. Para
definir la lista de valores permitidos se sigue un formato que es necesario detallar.
* Si el valor permitido se indica como una sucesión de palabras sin ningún carácter que las separe (paréntesis, comas,
barras, etc.) el valor de la propiedad se debe indicar tal y como se muestra y con esas palabras en el mismo orden.
* Si el valor permitido se indica como una sucesión de valores separados por una barra simple (carácter |) el valor de la
propiedad debe tomar uno y sólo uno de los valores indicados. Por ejemplo, la notación <porcentaje> | <medida> | inherit
indica que la propiedad solamente puede tomar como valor la palabra reservada inherit o un porcentaje o una medida.
* Si el valor permitido se indica como una sucesión de valores separados por una barra doble (símbolo ||) el valor de la
propiedad puede tomar uno o más valores de los indicados y en cualquier orden.
Por ejemplo, la notación <color> || <estilo> || <medida> indica que la propiedad puede tomar como valor cualquier
combinación de los valores indicados y en cualquier orden. Se podría establecer un color y un estilo, solamente una
medida o una medida y un estilo. Además, el orden en el que se indican los valores es indiferente. Opcionalmente, se
pueden utilizar paréntesis para agrupar diferentes valores.
Por último, en cada valor o agrupación de valores se puede indicar el tipo de valor: opcional, obligatorio, múltiple o
restringido.
El carácter * indica que el valor ocurre cero o más veces; el carácter + indica que el valor ocurre una o más veces; el
carácter ? indica que el valor es opcional y por último, el carácter {número_1, número_2} indica que el valor ocurre al
menos tantas veces como el valor indicado en número_1 y como máximo tantas veces como el valor indicado en
número_2.
Por ejemplo, el valor [<family-name> , ]* indica que el valor de tipo <family_name> seguido por una coma se puede
incluir cero o más veces. El valor <url>? <color> significa que la URL es opcional y el color obligatorio y en el orden
indicado. Por último, el valor [<medida> | thick | thin] {1,4} indica que se pueden escribir entre 1 y 4 veces un valor que
sea o una medida o la palabra thick o la palabra thin.
No obstante, la mejor forma de entender la notación formal para las propiedades de CSS es observar la definición de
cada propiedad y volver a esta sección siempre que sea necesario.
- Selectores
Una regla de CSS está formada por una parte llamada "selector" y otra parte llamada "declaración".
La declaración indica "qué hay que hacer" y el selector indica "a quién hay que hacérselo". Por lo tanto, los selectores
son imprescindibles para aplicar de forma correcta los estilos CSS en una página.
A un mismo elemento HTML se le pueden aplicar varias reglas CSS y cada regla CSS puede aplicarse a un número
ilimitado de elementos. En otras palabras, una misma regla puede aplicarse sobre varios selectores y un mismo selector
se puede utilizar en varias reglas.
El estándar de CSS 2.1 incluye una docena de tipos diferentes de selectores; no obstante, la mayoría de páginas de los
sitios web se pueden diseñar utilizando solamente los cinco selectores básicos.
- Selectores Básicos
1.- Selector universal

Se utiliza para seleccionar todos los elementos de la página. El siguiente ejemplo elimina el margen y el relleno de todos
los elementos HTML (por ahora no es importante fijarse en la parte de la declaración de la regla CSS):
*{
margin: 0;
padding: 0;
}
El selector universal se indica mediante un asterisco (*). A pesar de su sencillez, no se utiliza habitualmente, ya que es
difícil que un mismo estilo se pueda aplicar a todos los elementos de una página.
No obstante, sí que se suele combinar con otros selectores y además, forma parte de algunos hacks muy utilizados.
2.- Selector de tipo o etiqueta
Selecciona todos los elementos de la página cuya etiqueta HTML coincide con el valor del selector. El siguiente ejemplo
selecciona todos los párrafos de la página:
p{
...
}
Para utilizar este selector, solamente es necesario indicar el nombre de una etiqueta HTML (sin los caracteres < y >)
correspondiente a los elementos que se quieren seleccionar.
El siguiente ejemplo aplica diferentes estilos a los titulares y a los párrafos de una página HTML:
h1 {
color: red;
}
h2 {
color: blue;
}
p{
color: black;
}
Si se quiere aplicar los mismos estilos a dos etiquetas diferentes, se pueden encadenar los selectores. En el siguiente
ejemplo, los títulos de sección h1, h2 y h3 comparten los mismos estilos:
h1 {
color: #8A8E27;
font-weight: normal;
font-family: Arial, Helvetica, sans-serif;
}
h2 {
color: #8A8E27;
}
h3 {
color: #8A8E27;
}
En este caso, CSS permite agrupar todas las reglas individuales en una sola regla con un selector múltiple. Para ello, se
incluyen todos los selectores separados por una coma (,) y el resultado es que la siguiente regla CSS es equivalente a
las tres reglas anteriores:
h1, h2, h3 {
color: #8A8E27;
}
En las hojas de estilo complejas, es habitual agrupar las propiedades comunes de varios elementos en una única regla
CSS y posteriormente definir las propiedades específicas de esos mismos elementos. El siguiente ejemplo establece en
primer lugar las propiedades comunes de los títulos de sección (color y tipo de letra) y a continuación, establece el
tamaño de letra de cada uno de ellos:
h1, h2, h3 {
color: #8A8E27;
}
h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.2em; }
3.- Selector Descendente
Selecciona los elementos que se encuentran dentro de otros elementos. Un elemento es descendiente de otro cuando
se encuentra entre las etiquetas de apertura y de cierre del otro elemento.
El selector del siguiente ejemplo selecciona todos los elementos <span> de la página que se encuentren dentro de un
elemento <p>:
p span { color: red; }
Si el código HTML de la página es el siguiente:

<p>
...
<span>texto1</span>
...
<a href="">...<span>texto2</span></a>
...
</p>
El selector p span selecciona tanto texto1 como texto2. El motivo es que en el selector descendente, un elemento no
tiene que ser descendiente directo del otro. La única condición es que un elemento debe estar dentro de otro elemento,
sin importar el nivel de profundidad en el que se encuentre.
4.- Selector de clase
Si se considera el siguiente código HTML de ejemplo:

<body>
<p>Lorem ipsum dolor sit amet...</p>
<p>Nunc sed lacus et est adipiscing accumsan...</p>
<p>Class aptent taciti sociosqu ad litora...</p>
</body>
Una de las soluciones más sencillas para aplicar estilos a un solo elemento de la página consiste en utilizar el atributo
class de HTML sobre ese elemento para indicar directamente la regla CSS que se le debe aplicar:
<p class="destacado">Lorem ipsum dolor sit amet...</p>
A continuación, se crea en el archivo CSS una nueva regla llamada destacado con todos los estilos que se van a aplicar
al elemento. Para que el navegador no confunda este selector con los otros tipos de selectores, se prefija el valor del
atributo class con un punto (.) tal y como muestra el siguiente ejemplo:
.destacado { color: red; }
El selector .destacado se interpreta como "cualquier elemento de la página cuyo atributo class sea igual a destacado",
por lo que solamente el primer párrafo cumple esa condición.
Los selectores de clase son imprescindibles para diseñar páginas web complejas, ya que permiten disponer de una
precisión total al seleccionar los elementos. Además, estos selectores permiten reutilizar los mismos estilos para varios
elementos diferentes.
A continuación se muestra otro ejemplo de selectores de clase:
.aviso {
padding: 0.5em;
border: 1px solid #98be10;
background: #f6feda;
}
.error {
color: #930;
font-weight: bold;
}
<span class="error">...</span>
<div class="aviso">...</div>
5.- Selectores de ID
El selector de ID permite seleccionar un elemento de la página a través del valor de su atributo id. Este tipo de selectores
sólo seleccionan un elemento de la página porque el valor del atributo id no se puede repetir en dos elementos diferentes
de una misma página.
La sintaxis de los selectores de ID es muy parecida a la de los selectores de clase, salvo que se utiliza el símbolo de la
almohadilla (#) en vez del punto (.) como prefijo del nombre de la regla CSS:
#destacado { color: red; }
<p>Primer párrafo</p>
<p id="destacado">Segundo párrafo</p>
<p>Tercer párrafo</p>
En el ejemplo anterior, el selector #destacado solamente selecciona el segundo párrafo (cuyo atributo id es igual a
destacado).
6.- Combinación de selectores básicos
CSS permite la combinación de uno o más tipos de selectores para restringir el alcance de las reglas CSS. A
continuación se muestran algunos ejemplos habituales de combinación de selectores.
.aviso .especial { ... }

El anterior selector solamente selecciona aquellos elementos con un class="especial" que se encuentren dentro de
cualquier elemento con un class="aviso".
Si se modifica el anterior selector:
div.aviso span.especial { ... }

Ahora, el selector solamente selecciona aquellos elementos de tipo <span> con un atributo class="especial" que estén
dentro de cualquier elemento de tipo <div> que tenga un atributo class="aviso".
La combinación de selectores puede llegar a ser todo lo compleja que sea necesario:
ul#menuPrincipal li.destacado a#inicio { ... }

El anterior selector hace referencia al enlace con un atributo id igual a inicio que se encuentra dentro de un elemento de
tipo <li> con un atributo class igual a destacado, que forma parte de una lista <ul> con un atributo id igual a
menuPrincipal.
- Agrupación de reglas
Cuando se crean archivos CSS complejos con decenas o cientos de reglas, es habitual que los estilos que se aplican a
un mismo selector se definan en diferentes reglas:
h1 { color: red; }
...
h1 { font-size: 2em; }
...
h1 { font-family: Verdana; }
Las tres reglas anteriores establecen el valor de tres propiedades diferentes de los elementos <h1>. Antes de que el
navegador muestre la página, procesa todas las reglas CSS de la página para tener en cuenta todos los estilos definidos
para cada elemento.
Cuando el selector de dos o más reglas CSS es idéntico, se pueden agrupar las declaraciones de las reglas para hacer
las hojas de estilos más eficientes:
h1 {
color: red;
font-size: 2em;
font-family: Verdana;
}
El ejemplo anterior tiene el mismo efecto que las tres reglas anteriores, pero es más eficiente y es más fácil de modificar
y mantener por parte de los diseñadores. Como CSS ignora los espacios en blanco y las nuevas líneas, también se
pueden agrupar las reglas de la siguiente forma:
h1 { color: red; font-size: 2em; font-family: Verdana; }

Si se quiere reducir al máximo el tamaño del archivo CSS para mejorar ligeramente el tiempo de carga de la página web,
también es posible indicar la regla anterior de la siguiente forma:
h1 {color:red;font-size:2em;font-family:Verdana;}

Programación

Загружено:

Сведения о документе

Авторское право

Доступные форматы

Поделиться этим документом

Поделиться или встроить документ

Параметры публикации

Этот документ был вам полезен?

Это неприемлемый материал?

Авторское право:

Доступные форматы

Programación

Загружено:

Авторское право:

Доступные форматы

Apuntes de Unidad 2.

ETIQUETAS, SINTAXIS, ESTRUCTURA Y CARACTERÍSTICAS.

< (Menor que): &lt;

á: &aacute; Á: &Aacute; ¡: &#161;

Por lo tanto la palabra página la podríamos escribir como:

Otro ejemplo: ¿En qué año estamos?

Código JavaScript en un documento HTML

Los códigos JavaScript se pueden colocar en la cabecera o en el cuerpo del documento.

1) Es "Case Sensitive", es decir, distingue mayúsculas de minúsculas.

• Un nombre válido de variable no puede tener espacios.

Los tipos de datos que maneja JavaScript son:

Secuencias o Caracteres de escape en cadenas de texto

Descripción Carácter de escape

abstract boolean Break byte

ARITMETICOS LOGICOS DE COMPARACION

DE BIT A BIT DE ASIGNACION ESPECIALES

() [] . Paréntesis, corchetes y el operador punto que sirve para los objetos

De modo que los distintos tipos de las variables podrían ser:

Queremos destacar tan sólo dos detalles más:

-Toma de decisiones: 1) if 2) if… else 3) switch

Instrucciones break y continue

break: Significa detener la ejecución de un bucle y salirse de él.

function nombrefuncion (){

Existen dos opciones posibles para colocar el código de una función:

Parámetros de las Funciones

Entonces para llamar a la función de este ejemplo pondríamos:

EscribirBienvenida ("Alberto García")

function escribirBienvenida (nombre,colorTexto){

var miNombre = "Pepe"

Devolución de valores en las funciones

Ámbito de las variables en las funciones

HOJAS DE ESTILO EN CASCADA (CASCADING STYLE SHEETS, CSS)

- Funcionamiento básico de CSS

Existen tres opciones para incluir CSS:

1) Incluir CSS en el mismo documento HTML.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

2) Definir CSS en un archivo externo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

3) Incluir CSS en los elementos HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

Figura 1.1 Componentes de un estilo CSS básico

- Componentes de un estilo CSS básico

Los diferentes términos se definen a continuación:

- Sintaxis de la definición de cada propiedad CSS

1.- Selector universal

2.- Selector de tipo o etiqueta

3.- Selector Descendente

Si el código HTML de la página es el siguiente:

4.- Selector de clase

Si se considera el siguiente código HTML de ejemplo:

<p class="destacado">Lorem ipsum dolor sit amet...</p>

.destacado { color: red; }

#destacado { color: red; }

6.- Combinación de selectores básicos

.aviso .especial { ... }

Si se modifica el anterior selector:

div.aviso span.especial { ... }

ul#menuPrincipal li.destacado a#inicio { ... }

h1 { color: red; font-size: 2em; font-family: Verdana; }

Вам также может понравиться

< (Menor que): <

á: á Á: Á ¡: ¡