Cómo obtener href en JavaScript
"href"Significa un enlace de hipertexto. Mientras desarrolla un sitio web, la URL de la página a la que los puntos de enlace se especifican utilizando el ancla de HTML "" etiqueta. En ciertos escenarios, los desarrolladores deben determinar el valor del HREF, que es la URL de la página. Para hacerlo, JavaScript tiene algunos métodos incorporados que pueden ayudarlo.
Este manual discutirá las formas de obtener el valor HREF de la etiqueta de anclaje JavaScript.
Cómo obtener href en JavaScript?
Para determinar el valor HREF en JavaScript, use los siguientes métodos predefinidos de JavaScript:
- método getAttribute ()
- atributo href
Examinemos estos enfoques individualmente!
Método 1: Obtener href usando el método getattribute ()
El "getAttribute ()El método de la interfaz de elemento proporciona el valor de un atributo particular del elemento definido. El valor de retorno es nulo o la cadena vacía si falta el atributo deseado.
Sintaxis
Siga la sintaxis dada para obtener el href usando el método getAttribute ():
elemento.getAttribute (AttributeName)
Aquí, "Nombre del Atributo"Es el nombre del atributo cuyo valor queremos obtener.
Ejemplo: Obtener href usando el método QuerySelector () con el método getAttribute ()
Primero, crearemos una etiqueta de anclaje, un botón y una etiqueta para imprimir URL que obtendrá el valor HREF usando JavaScript "getAttribute ()" método:
Obtenga el href en JavaScript
Enlace
A continuación, defina el "getURL ()"Función en el archivo JavaScript, donde primero obtendremos la etiqueta de anclaje usando"QuerySelector ()Método "y luego llamar al método getAttribute () pasando HREF como argumento. Descubrirá la primera etiqueta de anclaje y recuperará su URL y la almacenará en el "href" variable. Finalmente, imprime el valor como el texto de la etiqueta adicional:
función getUrl ()
var href = documento.QuerySelector ('A').getAttribute ('href');
var url = documento.getElementById ('getUrl');
url.textContent = 'La url es $ href';
La salida muestra el valor de href en un botón clic:
Pasemos al siguiente método para obtener href en JavaScript.
Método 2: Obtenga HREF usando el atributo HREF
El otro método para obtener el valor HREF es el "href" atributo. El href es propiedad del "Htmlanchorelement"Eso actualiza el href y da una cadena con la URL completa.
Sintaxis
Use la siguiente sintaxis para obtener el valor HREF con la ayuda del "href" atributo:
ancla.href
Ejemplo: obtenga href usando el método getElementById () con el atributo href
Consideraremos el mismo enlace en la etiqueta de anclaje utilizada en el ejemplo anterior. Entonces, en el "getURL ()"Función, primero acceda a la etiqueta de anclaje pasando el"enlace"ID de la etiqueta de anclaje en el"getElementById ()"Método y llame al"href"Atributo con él. A continuación, nuevamente obtenga la etiqueta agregada utilizando el mismo procedimiento y establezca el valor del href recuperado como su contenido:
función getUrl ()
Const valor1 = documento.getElementById ("enlace").href;
const url = documento.getElementById ('getUrl');
url.textContent = 'La URL es $ value1';
Producción
Hemos proporcionado la solución más simple para obtener el valor HREF en JavaScript.
Conclusión
Para obtener el href en JavaScript, puede utilizar los métodos predefinidos de JavaScript, como el método getAttribute () y el atributo HREF. Lo único que separa el método getattribute () del atributo href es que devuelve el valor del elemento de ancla. En este manual, hemos discutido las formas de obtener el valor HREF de la etiqueta de anclaje JavaScript.