Obteniendo la ubicación hash URL, y usándola en jQuery

114

Me gustaría obtener el valor después de un hash en la URL de la página actual y luego poder aplicar esto en una nueva función ... ej.Obteniendo la ubicación hash URL, y usándola en jQuery

El URL podría ser

www.example.com/index.html#foo

y me gustaría utilizar esto en conjunto con el siguiente fragmento de código

$('ul#foo:first').show();

Estoy un poco asumiendo/esperanza hay alguna manera de agarrar esto, y convertirlo en una variable que luego puedo usar en el segundo fragmento de código.

¡Cualquier ayuda sería enormemente apreciada!

Saludos

Fuente

2009-11-30 Robbie White

No tengo ningún código para usted, pero debe asegurarse de desinfectar la entrada, ya que parece estar listo para la inyección de código. –

245

Nota del editor: el enfoque de abajo tiene serias implicaciones de seguridad y, dependiendo de la versión de jQuery que está utilizando, puede exponer a los usuarios a ataques XSS. Para obtener más detalles, consulte la discusión sobre el posible ataque en los comentarios de esta respuesta o this explanation on Security Stack Exchange.

Puede utilizar la propiedad location.hash para agarrar el hash de la página actual:

var hash = window.location.hash; 
$('ul'+hash+':first').show();

Tenga en cuenta que esta propiedad ya contiene el símbolo # al principio.

En realidad, usted no necesita el pseudo-selector de :first dado que está utilizando el ID selector, se supone que son identificadores únicos dentro del DOM.

En caso de que quiera obtener el hash de una cadena de URL, puede utilizar el String.substring método:

var url = "http://example.com/file.htm#foo"; 
var hash = url.substring(url.indexOf('#')); // '#foo'

Consejo: Tenga en cuenta que el usuario puede cambiar el hash como él quiere, inyectando algo a su selector, debe verificar el hash antes de usarlo.

Fuente

2009-11-30 21:46:25 CMS

+26

Tenga en cuenta que los selectores jQuery se pueden utilizar para ejecutar código JavaScript personalizado, por lo que el uso de hashes no optimizados es horriblemente inseguro. Hay una solución a medias para esto en las versiones recientes de jQuery para selectores que contienen un # antes del código inyectado, pero usted todavía está en riesgo si elimina la marca # desde el comienzo de location.hash. P.ej. 'var hash = location.hash.slice (1); $ ('ul.item' + hash) .show(). append ($ ('# content')); 'esto ejecutará una etiqueta de script puesta en el hash. Es un buen hábito usar '$ ('cuerpo'). Find ('ul' + hash + ': first')' en lugar de '$ ('ul' + hash + ': first')'. – Tgr

+37

Algunos navegadores devuelven el símbolo hash, y otros no, por lo que es más seguro usar: 'var hash = location.hash.replace ('#', '');' – Tim

@Tgr Cuando dice que "usar hashes no optimizados es horrible, terriblemente inseguro, "¿puedes explicar qué se puede hacer? ¿Estamos hablando de un usuario que piratea su propia computadora? Simplemente no puedo pensar cuál es la verdadera vulnerabilidad y realmente agradecería alguna elaboración. – snapfractalpop

location.hash no es seguro para IE, en el caso de IE (incluyendo IE9), si su página contiene iframe, a continuación, después de la actualización manual en el interior contenido anidado obtener el valor location.hash es viejo (valor para la primera carga de la página) mientras que el valor recuperado manual es diferente a lo que siempre location.hash recuperarlo a través document.URL

var hash = document.URL.substr(document.URL.indexOf('#')+1)

Fuente

2012-12-04 12:52:46

Actualización: document.URL no contiene valor hash en firefox 3.6, por lo que location.href es seguro var hash = location.href.substr (location.href.indexOf ('#') + 1) –

Para aquellos que están buscando una solución javascript puro

document.getElementById(location.hash.substring(1)).style.display = 'block'

Hope esto le ahorra tiempo.

Fuente

2016-06-13 10:49:15

Obteniendo la ubicación hash URL, y usándola en jQuery

Respuesta

Cuestiones relacionadas