Lista de variables y funciones de JavaScript para usar en páginas web

 Recopilación de las variables y funciones de Javascript más empleadas en el diseño y la programación web, las interpretan la gran mayoría de los navegadores, para agregarle funcionalidad y dinamismo a las páginas web, códigos y ejemplos prácticos.

Javascript es un lenguaje de programación, es muy usado en el ámbito de la creación y del diseño web ya que posee varias características que lo hacen ideal, por ejemplo:

• Funciones y variables sencillas, fácil de comprender y utilizar, aun sin ser experto en el lenguaje, solo copiando y pegando porciones de código.
• Es un lenguaje interpretado, es decir solo es ejecutado por el navegador web, no por el sistema operativo.
• Funciona del lado del cliente, es decir la página web solo se carga una vez del servidor y posteriormente las funciones que contiene se ejecutan sin tener que recargarla, diferente a lenguajes como PHP que son lenguajes de servidor.

Lo usamos en varias páginas de nuestro sitio para agregarles interactividad y funciones útiles a las páginas y además para crear varias herramientas web, que se pueden usar online.
Los que no estén familiarizados con este lenguaje y sientan curiosidad, pueden leer en otro artículo una sencilla introducción.
En esta página compartimos una recopilación de variables y funciones de JavaScript, que se pueden emplear en las páginas web en multitud de funciones.

Lista de las variables y funciones de JavaScript

Lista de las variables y funciones de JavaScript compatibles con la mayor parte de los navegadores y más utilizadas y útiles en las páginas web.
Están agrupadas por su clasificación.
Las variables se pueden probar usando los enlaces marcados con el color verde o copiándolas y pegándolas en el siguiente "Interprete de JavaScript", herramienta que permite probar cualquier variable ya sea global o propia de esta página.

Interprete de variables de Javascript

Document Object

Al ser cargada una página web por el navegador, Windows la considera como un objeto, por lo que las siguientes variables devuelven información como si la página fuera un objeto.

document.title	Muestra el título de la página actual
document.URL	Muestra la dirección URL de la página actual
document.referrer	Muestra la dirección URL de la página que dirigió a la actual
document.lastModified	Fecha de la última modificación de la página
document.domain	Muestra el nombre de dominio del sitio web
document.cookie	Muestra las cookies guardadas por este sitio web en tu equipo
document.links.length	Muestra el número de links en la página
document.links[0].innerHTML	Muestra el nombre del primer link
document.links[1].innerHTML	Muestra el nombre del segundo link
document.anchors.length	Número de anchors en la página
document.forms.length	Número de formas en la página
document.forms[0].name	Muestra el nombre de la primera forma
document.images.length	Número de imágenes en la página
document.images[0].id	Muestra la identidad (ID) de la primera imagen
document.getElementById()	Permite identificar un elemento en una página por su identidad (ID), entonces ejecuta una acción, en este caso se emplea: document.getElementById('test').innerHTML='Hola';void 0 (test es un DIV o contenedor con dicha identidad en la página, innerHTML='Hola' escribe el texto indicado y void 0 se utiliza para evitar que el navegador cargue una nueva página).
document.write()	Escribe texto, código o el resultado de una variable en una página, se usa de las siguientes formas: document.write('texto') document.write(variable) document.write('texto'+variable) document.write('texto'+variable+'texto')

Lee más información sobre las opciones y el uso de document.write y innerHTML en la siguiente página: Como escribir con Javascript texto y otros elementos en las páginas web

Navigator Object

Las siguientes variables devuelven información del navegador usado para cargar la página.

navigator.appCodeName	Devuelve el código del nombre del navegador web con que se carga la página
navigator.appName	Devuelve el nombre del navegador
navigator.appVersion	Versión del navegador
navigator.cookieEnabled	Comprueba si están habilitadas las cookies en el navegador (true=Si, false=No)
navigator.platform	Plataforma del navegador
navigator.userAgent	Agente de usuario enviado por el navegador al servidor
navigator.javaEnabled	Se comprueba si está habilitada Java en el navegador (true=Si, false=No)

Location Object

location.host	Devuelve el nombre del host de una dirección web
location.hostname	Similar al anterior
location.href	Devuelve la dirección URL completa
location.pathname	Devuelve solo la ruta relativa en el servidor a la pagina
location.port	Devuelve el número del puerto usado
location.protocol	Muestra el protocolo usado (http, https, file, ftp, etc.)
location.reload()	Vuelve a cargar la página (window.location.reload(true))
location.href	Encadenando location.href se refresca el contenido de la página (vuelve a cargarla), en este caso se usa: location.href=location.href
Ver el código fuente de la página	Para eso se encadena de la siguiente forma: location.href = 'view-source:' + window.location.href (No funciona en Internet Explorer) History Object history.length Devuelve la cantidad de direcciones URL en la lista del historial history.back() Página anterior en el historial history.forward() Página siguiente en el historial history.go() Carga una página determinada del historial, en este caso se emplea: history.go(0) por lo que recarga la página actual, similar a usar la tecla F5 Screen Object screen.height Devuelve la altura total de la pantalla en pixeles screen.width Devuelve el ancho total de la pantalla en pixeles screen.availHeight Devuelve la altura de la pantalla disponible en pixeles screen.availWidth Devuelve el ancho de la pantalla disponible en pixeles screen.colorDepth Profundidad de color de la pantalla para mostrar imágenes screen.pixelDepth Resolución del color en bits por pixel de la pantalla

Window Object

window.onload	Ejecuta una función o varias inmediatamente después de que termine la carga de la página por completo, en este caso se emplea una alerta que se muestra al entrar a la página. El código usado es: <script type="text/javascript"> window.onload=alert('Hola, Bienvenido a Javascript') </script> Este código se debe insertar en el final de la página, justo antes del cierre de la etiqueta </body>
window.parent.location	Devuelve la dirección URL de la página actual
window.parent.location	Conduce a una dirección web, en este ejemplo: window.parent.location='http://norfipc.com'
window.alert()	Muestra una ventana de alerta con un mensaje: window.alert('Mensaje')
window.confirm()	Confirmación, muestra un cuadro de dialogo con un mensaje, un botón Aceptar y uno Cancelar: window.confirm('Desea?....') Generalmente se usa encadenada con otra función
window.prompt()	Muestra un cuadro de dialogo que inquiere al usuario por una respuesta, se usa: window.prompt('Mensaje','Quiere..?') Al igual que la anterior se usa con una función que se ejecuta en caso del usuario oprimir el botón Aceptar
window.open()	Abre una nueva ventana o pestaña según como se emplee, ninguna de las variantes funciona en el navegador Internet Explorer por cuestiones de seguridad.
window.open()	En este ejemplo se abre una nueva ventana llamada "new", para eso se emplea el siguiente código: nv=window.open('','new','width=344,height=444,left=50,top=50') Mas información sobre todas las opciones de window.open() en la siguiente página: Como abrir links de una página web en una nueva ventana con Internet Explorer y otros navegadores.
close()	Cierra una ventana, en este ejemplo cierra la ventana abierta anteriormente: nv.close()
window.open()	En este ejemplo se emplea window.open() para abrir una nueva pestaña
close()	Cierra la pestaña abierta anteriormente
top.close()	Cerrar pestaña
window.name	Muestra el nombre de una ventana, se emplea: nv=window.open('','new','width=344,height=444'); nv.document.write('Esta ventana se llama: ' + nv.name)
window.innerHeight	Muestra la altura en pixeles del tamaño de la ventana del navegador (No es compatible con Internet Explorer)
window.innerWidth	Muestra el ancho en pixeles del tamaño de la ventana del navegador (No es compatible con Internet Explorer)
window.print()	Imprime el contenido de la ventana. Más información sobre las opciones para utilizar window.print(), puedes leerla en la siguiente página: Como imprimir solo un área, parte o sección de una página web
window.resizeBy()	Este método cambia de tamaño la ventana del navegador, mueve la esquina derecha inferior de la ventana, la cantidad de pixeles que se determine, ya sea positiva un incremento o negativa una reducción, la esquina superior izquierda permanecerá inmóvil. En este ejemplo se emplea: window.resizeBy(100,100) lo que incrementa en 100 pixeles su tamaño en cada eje (no funciona en Opera y Chrome).
window.resizeTo()	Ajusta el tamaño de la ventana al número de pixeles que se determine, en este ejemplo se emplea: window.resizeTo(1000,800)
window.scrollBy()	Desplaza el contenido de la ventana en un determinado número de pixeles, hacia arriba o hacia abajo según se establezca de forma positiva o negativa, en este ejemplo se emplea: window.scrollBy(50,-50) Combinando la function window.scrollBy con setTimeout se puede hacer que la página vaya desplazándose continuamente, se puede iniciar la función al cargar la página mediante el evento onload o con un vínculo de la siguiente forma: <script type="text/javascript"> function pageScroll() {window.scrollBy(0,30); scrolldelay = setTimeout('pageScroll()',800);} function stopScroll() {clearTimeout(scrolldelay);} </script> <a href="javascript:pageScroll()">Scroll</a> <a href="javascript:stopScroll()">STOP</a> Scroll STOP
window.scrollTo()	Dezplaza el contenido de la ventana a unas coordenadas específicas, en este caso se usa: window.scrollTo(750,650)
window.moveTo()	Mueve la ventana del navegador a una posición específica en la pantalla definida en pixeles, en este caso: window.moveTo(222,222)
window.moveBy()	Mueve la ventana del navegador a una ubicación en relación con su posición actual determinada en pixeles, en este caso: window.moveBy(200,300)
window.screenLeft	Muestra el número de pixeles distantes a la pantalla, del borde izquierdo de la ventana al borde izquierdo de la pantalla (Solo Internet Explorer)
window.screenTop	Muestra el número de pixeles distantes a la pantalla, del borde superior de la ventana al borde superior de la pantalla (Solo Internet Explorer)
window.screenX	Muestra el número de pixeles distantes a la pantalla, del borde izquierdo de la ventana al borde izquierdo de la pantalla (Firefox y Google Chrome)
window.screenY	Muestra el número de pixeles distantes a la pantalla, del borde superior de la ventana al borde superior de la pantalla (Firefox y Google Chrome)

document.documentElement.clientHeight	Muestra la altura en pixeles del tamaño de la ventana del navegador (Todos los navegadores)
document.documentElement.clientWidth	Muestra el ancho en pixeles del tamaño de la ventana del navegador (Todos los navegadores)

Mensajes de error de Javascript

En ocasiones al solicitar el resultado de una variable Javascript devuelve los siguientes mensajes predeterminados:

NaN = "Not-a-Number", significa que el resultado no es un número.
Undefined = Indica que a la variable no se le ha asignado ningún valor.
Infinity = Significa un valor imposible de representar.

Herramientas

Bookmarklet para probar funciones y variables de Javascript, no funciona en Internet Explorer.
En otros navegadores abre una pequeña ventana a la izquierda donde se puede escribir o pegar una variable o función y probarla.
Arrástralo a la barra de marcadores del navegador para guardarlo y usarlo posteriormente.
Editor Javascript

---

Páginas con información sobre cómo usar las funciones de Javascript

Como usar la función SetTimeout para retrasar las ejecución de una función
Como hacer las redirecciones de páginas web usando Javascript

La fecha y hora escrita con Javascript

Viernes, 19 de Noviembre del 2021
3:44:24 PM

Lee toda la información en la siguiente página: Como mostrar la fecha y hora en las páginas web usando Javascript