Ir a la URL con Onclick en JavaScript

Shraddha Paghdar 12 octubre 2023
  1. Ir a la URL usando window.open() en JavaScript
  2. Ir a la URL usando window.location en JavaScript
Ir a la URL con Onclick en JavaScript

El objeto de ventana es uno de los objetos más importantes que se utilizan para hablar con el navegador. Representa la ventana del navegador. Todas las variables globales, funciones se convierten en miembros del objeto ventana. El objeto de ubicación de la ventana se utiliza para obtener la URL de la página actual y también para cambiar la URL para la redirección.

En el artículo de hoy, aprenderemos cómo ir a la URL con onclick en JavaScript.

El objeto de la ventana de JavaScript proporciona dos formas, la primera está utilizando el atributo de ubicación y la segunda está utilizando el método open().

Ir a la URL usando window.open() en JavaScript

Es un método de interfaz de ventana proporcionado por JavaScript, que carga la URL / recurso especificado en una nueva pestaña o navegador existente con el nombre especificado. Este método generará una nueva ventana para abrir una URL específica. Cada vez que el método window.open() devuelve, contiene about:blank. La URL real se cargará una vez que el bloque de script actual complete su ejecución.

Sintaxis de window.open() en JavaScript

window.open(url, windowName, windowFeatures);

Parámetro

  • url: es un parámetro obligatorio que acepta URL válidas, rutas de imágenes u otros recursos compatibles con los navegadores. Si se pasa una cadena vacía, se abrirá una nueva pestaña con una URL en blanco.
  • windowName: Es un parámetro opcional, que especifica el nombre del contexto de navegación. Esto no define el título de la ventana. Además, este nombre de ventana no debe contener espacios en blanco.
  • windowFeatures: Es un parámetro opcional. Este parámetro acepta propiedades de ventana separadas por comas de una nueva pestaña, ya sea en la forma de name=value o simplemente name si la propiedad es booleana. Algunas de las características son la posición y el tamaño predeterminados del objeto de ventana.

Código de ejemplo:

<button type="button" id="btn" onclick="openGoogleByMethod()">Open Google</button>
window.open('https://www.google.com');

Ir a la URL usando window.location en JavaScript

Es una propiedad de sólo lectura de window.location, que devuelve el objeto Location. Este objeto contiene información sobre la ubicación actual del documento. El objeto de ubicación también contiene otras propiedades como href, protocol, host, hostname, port, etc.

También se puede acceder a las propiedades de window.location directamente usando location porque el objeto de la ventana siempre permanece en la parte superior de la cadena de alcance. Los usuarios pueden utilizar la propiedad href o assign el método del objeto Location para cargar / abrir otras URL / recursos.

Sintaxis

window.location = URL_PATH;
window.location.href = URL_PATH;
window.location.assign(URL_PATH);

Parámetro

  • URL_PATH: Es un parámetro obligatorio que acepta URL válidas que deben abrirse. Esta URL puede ser una URL absoluta, una URL relativa, una URL de anclaje o un nuevo protocolo.

Código de ejemplo:

<button type="button" id="btn" onclick="openGoogle()">Open Google</button>
window.location = 'https://www.google.com';
window.location.href = 'https://www.google.com';
Shraddha Paghdar avatar Shraddha Paghdar avatar

Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.

LinkedIn