Salta a anclar en JavaScript

Salta a anclar en JavaScript
Al crear una página web o el sitio, es necesario redirigir al usuario a una página específica varias veces o a una página en particular en algún momento. Además de eso, hacer que el contenido relevante sea accesible para el usuario final al instante. En tales casos, saltar para anclar en JavaScript es útil para ahorrar el tiempo y el esfuerzo al final del usuario.

Este blog explicará los enfoques para saltar para anclar en JavaScript.

Cómo saltar para anclar en JavaScript?

Saltar a anclar en JavaScript se puede lograr utilizando los siguientes enfoques:

  • "getElementById ()" método.
  • "ubicación.href" propiedad.

Enfoque 1: Salta a anclar en JavaScript usando el método GetElementById ()

El "getElementById ()"El método accede a un elemento con la" ID "especificada. Este método se puede aplicar para obtener el elemento de anclaje y redirigir al sitio especificado al hacer clic en el botón.

Sintaxis

documento.getElementById (elemento)

En la sintaxis dada:

  • "elemento" se refiere a "identificación"Ser recuperado contra el elemento particular.

Ejemplo
En este ejemplo en particular, siga los pasos establecidos:


Proceda al sitio de Google









En las líneas de código anteriores, realice los siguientes pasos:

  • Dentro de ""Etiqueta, especifique que el sitio declarado tenga un asignado"identificación"Con la ayuda del"href" atributo.
  • Además, incluya una imagen y cree un botón que tenga un adjunto "al hacer clic"Evento invocando la función Jumpanchor ().
  • En la parte de JavaScript del código, acceda al "ancla"Elemento por su"identificación" utilizando el "documento.getElementById ()" método.
  • Esto dará como resultado saltar a la parte de anclaje sobre el clic del botón.

Producción

De la salida anterior, se puede observar que al hacer clic en el botón, la página se redirige al "Url"Realizando así la funcionalidad del"ancla" elemento.

Enfoque 2: Salta a anclar en JavaScript usando la ubicación.propiedad href

El "ubicación.href"La propiedad devuelve la URL de la página actual. Esta propiedad se puede utilizar para acceder a la "ID" aprobada en la función a la que se accederá y saltar a ella.

Ejemplo
Sigamos el código de código a continuación:


Esta es una imagen



Este es un párrafo


JavaScript es un lenguaje de programación muy efectivo. Se puede integrar con HTML para realizar funcionalidades adicionales para hacer que una página web general o el sitio sea atractiva y receptiva.


Salta al primero



Saltar al segundo
  • Incluir un encabezado con un específico "identificación"Y una imagen.
  • Del mismo modo, en el siguiente paso, incluya otro encabezado con un específico "identificación"Y un párrafo.
  • Adjuntar un "el ratón por encima"Evento para el"ancla"Elemento invoca la función JumpArChor () que contiene la declarada"identificación"Como su parámetro.
  • Del mismo modo, repita el paso anterior para otro "ancla"Elemento con una función que tiene la especificación"identificación".

Continuemos a la parte de JavaScript del código:

En el código anterior-snippet:

  • Declarar una función llamada "Jumpanchor ()". En su parámetro, "identificación"Se refiere a la identificación para saltar cuando se accederá a la función en el"ancla" elemento.
  • En su definición, el "ubicación.href"La propiedad se utilizará para saltar a la cima ("#") Del correspondiente"identificación"Discutido en el paso anterior.

Producción

En la salida anterior, se puede observar que al pasar el mouse "Salta al primero", El documento se salta a la parte superior del ancla correspondiente.

Conclusión

El "getElementById ()"Método o el"ubicación.href"La propiedad se puede utilizar para saltar a un ancla y realizar sus funcionalidades en JavaScript. El método anterior redirige el documento al sitio especificado al hacer clic en el botón. El último enfoque se puede implementar para aprobarse "identificación"Sobre la función accedida dentro del"ancla"Elemento y salta a él. Este artículo explicó los enfoques para saltar para anclar en JavaScript.