Question

我想在当前页面的URL中获取哈希后的值，然后能够在新函数中应用它...例如。

网址可以是

www.example.com/index.html#foo

我想将此与下面的代码一起使用

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

我有点假设/希望有一些方法可以抓住这个，并把它变成一个变量，然后我可以在第二段代码中使用它。

Answer 1

编者注： 以下方法具有严重的安全隐患，并且根据您使用的jQuery版本，可能让您的用户暴露于XSS攻击。有关详细信息，请参阅此答案评论中对可能的攻击的讨论或this explanation on Security Stack Exchange。

您可以使用location.hash属性来获取当前页面的哈希值：

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

请注意，此属性在开头已包含#符号。

实际上，由于您使用ID selector，因此不需要:first伪选择器，因此假设DOM中的ID 唯一。

如果您想从URL字符串中获取哈希值，可以使用String.substring方法：

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

建议：请注意用户可以根据需要更改哈希，向您的选择器注入任何内容，您应该在使用之前检查哈希值。

Answer 2

location.hash对IE不安全，对于IE（包括IE9），如果你的页面包含iframe，那么在iframe内部手动刷新后获取location.hash值是旧的（值）对于第一页加载）。手动检索的值与location.hash不同，所以总是通过document.URL

检索它

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

Answer 3

对于那些正在寻找纯JavaScript解决方案的人

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

希望这可以节省你一些时间。

Answer 4

自jQuery 1.9起，:target选择器将匹配URL哈希。因此，您可以这样做：

Catch

会选择ID与哈希匹配的元素并显示出来。

Answer 5

我正在使用它来解决@CMS答案中指出的安全隐患。

console.log('start');

// Putting this in a setTimeout so that "start" logs above
// before the below code starts blocking
setTimeout(() => {
  const theProm = (async () => {
    const t0 = performance.now();
    while (performance.now() - t0 < 1000);
  })();

  theProm.then(() => {
    console.log('done');
  });
}, 100);

Answer 6

如果当前页面有哈希值，我建议首先使用cek。否则它将是undefined。

$(window).on('load', function(){        
    if( location.hash && location.hash.length ) {
       var hash = decodeURIComponent(location.hash.substr(1));
       $('ul'+hash+':first').show();;
    }       
});

获取URL哈希位置，并在jQuery中使用它

6 个答案: