1. Escribir algo en documento actual

Lo primero que aprenderemos a hacer sera escribir algo en el dcumento actual. Para esto usaremos el método write del objeto document. Mas adelante hablare de algunos otros metodos de este mismo objetos como son: clear, close, open y writeln.

La sintaxis es la siguiente: document.write("Texto")

Además de un texto, tambien se pueden mostrar variables, resultados de funciones, etc. Recuerda que basta introducir el codigo en el lugar que quieres que aparezca el texto sobre tu pagina.

<HTML>
<HEAD> <TITLE>Ejemplo 1</TITLE></HEAD>
<BODY>
... codigo HTML
<SCRIPT LANGUAGE=JavaScript>
<!-- esconder codigo
document.write ("Hola que tal...")
// fin esconder-->
</SCRIPT>
... mas codigo HTML
</BODY>
</HTML>

Recuerda que tienes que añadir los comentarios para prevenir a los navegadores que no soportan JavaScript.

2. Escribir algo en un nuevo documento

Ahora usaremos el mismo ejemplo anterior pero lo mostraremos en un nuevo documento, que sera abrierto en una nueva ventana. Para esto usaremos el metodo open del objeto window cuya sintaxis es: [ventana=]window.open('URL','nombre',['caracteristicas'])

ventana
Nombre de la nueva ventana (opcional)
URL
Pagina a cargar
nombre
Nombre para referirse a la ventana en los atributos
caracteristicas
son todos opcionales
width
Ancho en pixels de la ventana
height
Alto en pixels de la ventana
resizable
=yes o no, =1 o 0
scrollbars
=yes o no, =1 o 0
status
=yes o no, =1 o 0
menubar
=yes o no, =1 o 0
toolbar
=yes o no, =1 o 0
location
=yes o no, =1 o 0
directories
=yes o no, =1 o 0

Para dispara la apertura de esta ventana usamos el evento onClick del objeto link, con la siguiente sintaxis:
<A HREF="" onClick="window.open('js10a.htm','','width=300,height=80');return false">Ejemplo 2</A>

Pulsa para ver el efecto del Ejemplo 1 o del Ejemplo 2

3. Mostrar el resultado de una funcion de usario

Primero creamos una función de usuario y le asignamos parametros y luego mostramos el resultado de dicha funcion usando el metodo write del objeto document y añadiendo algunas de sus propiedades.

<HTML>
<HEAD> <TITLE>Ejemplo 3</TITLE> </HEAD> <BODY> <SCRIPT> <!-- esconder codigo function Suma(a,b) { return a+b } document.write("La suma de 4+7 es = ".fontcolor("red"),Suma(4,7)) // Fin esconder --> </SCRIPT> </BODY> </HTML>

Pulsa para ver el efecto del Ejemplo 3

Nota ademas que active resizable en esta ventana.

4. Escribir algo en pantalla

En este ejemplo usaremos la propiedad link del objetos document para hacer un enlace desde esta nueva ventana.

<HTML>
<HEAD>
   <TITLE>Ejemplo 3</TITLE>
</HEAD>
<SCRIPT>
   <!-- esconder codigo
   document.write("Si estas interesado en aprender los comandos HTML consulta "+"mi manual".link("http://www.uap.edu.pe/samples/demo/demo.htm").big())
// Fin esconder --> </SCRIPT> <BODY> </BODY> </HTML>

Pulsa para ver el efecto del Ejemplo 4

Nota ademas que active status en esta ventana.

5. Funcion que convierte Decimal en Hexadecimal

Pulsa para ver el efecto del Ejemplo 5

Nota ademas que active toolbar en esta ventana.

6. Hora coordinada universal

<HTML>
<HEAD>
	<SCRIPT>
		<!-- esconder codigo
		function Dime() {
			var fecha = new Date(document.lastModified);
			var laHora = Hoy.getHours();
			var Diferencia = (Hoy.getTimezoneOffset() / 60);
			laHora -= Diferencia;
			if (Hoy > 23)  {laHora -= 24 }
			document.write(laHora + " horas, " + Hoy.getMinutes() + " minutos");
			window.setTimeout("Dime();", 60000);
		}
		// Fin esconder -->
	</SCRIPT>
</HEAD>

<BODY>
<SCRIPT>
	<!-- llama a la funcion
	Dime();
</SCRIPT>
</BODY>
</HTML>

Pulsa para ver el efecto del Ejemplo 6

Nota ademas que active menubar en esta ventana.