Lección 1: Objetos, métodos y propiedades

A través de JavaScript, podemos acceder a la página web o al navegador que usamos mediante el uso de algunos objetos. Lo objetos disponibles son: document (página web actual), window ( la ventana del navegador), history ( historial de navegación), location (contiene la URL actual) y navigator (información relativa al navegador que usamos).

Cada uno de estos objetos cuentan con métodos y propiedades. Hacemos uso de un método para realizar una acción (por ejemplo, escribir texto en la página web) y hacemos uso de una propiedad cuando le asignamos un valor a esta (por ejemplo, darle color al fondo de la página web). A continuación especificamos los objetos mencionados arriba y algunos de sus métodos:

document.write: Nos permite escribir texto en la página actual.
document.bgColor: Color de fondo de la página actual.
document.fgColor: Color de la fuente de la página actual.
document.getElementById: Obtiene un elemento HTML del documento actual.
document.title: Título de la página actual.
window.open: Abre una nueva ventana del navegador.
history.go(posición entero o cadena URL): Nos permite navegar por el historial del navegador.
location.hostname: Nos da el nombre del dominio del servidor.
navigator.appName: Muestra en nombre del navegador que se está usando.
navigator.appVersion: Muestra la versión del navegador.
navigator.UserAgent: Proporciona más detalles del navegador.

Ya de manera personal, podemos averiguar más de cada uno de los objetos y sus respectivos métodos y propiedades. De momento lo que tenemos nos servirá muchísimo. Veamos algunos ejemplos:

Cambiar el color de fondo y texto [ver ejemplo]

Hacemos uso del objeto document y sus propiedades bgColor y fgColor, para darle color al fondo y el texto.

<html>
<head>
<title>Colores con JavaScript</title>
</head>
<body>
 <script type="text/javascript">
  //fondo de pagina color rojo
  document.bgColor="red";
  //texto de color verde
  document.fgColor="#00ff00";
 </script>
<h1>Cambiando de color de fondo y texto</h1>
</body>
</html>

¿Que navegador usas? [ver ejemplo]

Hacemos uso de objeto navigator y sus métodos para saber los detalles del Navegador que usamos y los mostramos con el objeto document y su método write. Tener en cuenta que podemos escribir etiquetas HTML en este método como veremos a continuación.

<html>
<head>
<title>Navegador que uso</title>
</head>
<body>
 <script type="text/javascript">
  /*averguaremos que navegador usamos
  y los detalles de este*/
  document.write("Navegador: " + navigator.appName)
  document.write("<br />")
  document.write("Version: " + navigator.appVersion)
  document.write("<br />")
  document.write("Detalles: " + navigator.userAgent)
 </script>
<h1>Navegador que uso</h1>
</body>
</html>

Adicionalmente …

Note que cada línea de código en JavaScript termina con punto y coma (;), muy similar a Java, C/C++, PHP. Aunque muchos navegadores web no hacen problemas por si le colocaste o no el punto y coma, es una buena práctica hacerlo pues es la manera correcta según lo estándares.

Se habrá dado cuenta que al inicio de algunas líneas de código colocamos doble barra invertida (//) esto sirve para colocar cualquier mensaje o comentarios que queramos, esto no alterará ni complicará el código. Muchos programadores tienen la práctica de agregar comentarios explicando como funciona el código. Pero solo sirve para una sola línea.

Sin embargo, si queremos agregar varias líneas de comentario, entonces usamos /* al inicio del nuestro comentario de varias líneas y la cerramos con */.

Ejemplo de estos 3 puntos adicionales:

.
.
.
<script type="text/javascript">
  //esto es un comentario de una sola línea
  document.write("Hola Mundo");
  /* como vemos hacemos uso de punto y coma
  para terminar una línea de código*/
</script>
.
.

Lección 1: Objetos, métodos y propiedades

Adicionalmente …

One thought on “Lección 1: Objetos, métodos y propiedades”

Leave a Reply Cancel reply