window.location.href vs clic en un ancla

Question

¿Cuál es la diferencia entre hacer clic en:

<a href /> 

vs

llamando window.location.href = ...

?

Answer 1

Siempre que sea posible, debe usar <a href="foo.html"> sobre window.location.href, por una serie de muy buenas razones.

1. Si tiene javascript deshabilitado, ninguno de los enlaces funcionaría.
2. Las arañas, como Google Bot, no interpretan javascript, por lo que no seguirán ninguno de sus enlaces.
3. SE ROMPA LA INTERNET. No, en realidad, la World Wide Web está construida sobre la base misma de los enlaces detectables entre páginas. Ocultar estos enlaces con enlaces no estándar ... err, va en contra de esa premisa.
4. Se convierte en una experiencia negativa para el usuario: un usuario espera que cuando puntero del ratón sobre un enlace, van a tener acceso a cierta información: (muy importante)
   • el destino que aparece en la barra de estado
   • haga clic derecho -> ubicación de copia de enlace
   • botón central del ratón -> nueva pestaña abierta
   • etc
   • Usando window.location rompe todos estos
5. ¡Es mucho más fácil!

Answer 2

Con el anclaje puede especificar la propiedad de destino, pero con window.location.href no puede. Generalmente, el delimitador se usa cuando un usuario desea redirigir el navegador a otra ubicación, window.location.href se usa cuando la redirección se realiza mediante javascript.

Answer 3

Además de las otras respuestas dadas, al hacer clic en un elemento <a> con el atributo href sapecified hará que el navegador para navegar a la dirección URL en el href, independientemente de que JavaScript está activado o no.

Answer 4

No olvide que, al hacer clic en un hipervínculo (etiqueta de anclaje), se activará el controlador onclick de ese elemento (si lo hay), mientras que la versión de Javascript no cambia y simplemente cambia la ubicación de la ventana.

Es posible invocar manualmente el controlador onclick desde Javascript si desea simular un clic, pero debe recordar hacerlo manualmente. Los fragmentos que publicó diferirían en este sentido, lo que podría ser la causa de las diferencias de comportamiento.

Answer 5

Configuración window.location.href = 'thepage.html' es lo mismo que llamar:

window.open('thepage.html', '_self'); 

es decir, el objetivo está limitado a la misma ventana, ya que es donde está la propiedad de ubicación.Esto tiene el mismo efecto que hacer clic en un enlace sin un atributo de destino:

<a href="thepage.html">...</a> 

Puede utilizar el método abierto en lugar de especificar un objetivo diferente, como una nueva ventana:

window.open('thepage.html', '_blank'); 

Esto tiene el mismo efecto como hacer clic en un enlace con ese objetivo:

<a href="thepage.html" target="_blank">...</a> 

También puede utilizar el método abierto para abrir una nueva ventana. El valor de retorno es una referencia a la ventana, por lo que puede usarlo para establecer la ubicación de esa ventana en lugar de la ventana actual:

var w = window.open('about:blank', '_blank'); 
w.location.href = 'thepage.html'; 

Answer 6

document.referrer contiene una referencia en el servidor y el cliente para la url de la página que contenía el enlace en el que el usuario hizo clic para acceder a la nueva página, , los métodos de ubicación con guiones no.