How can you check for a #hash in a URL using JavaScript?

Toytown_Mafia_21709 0
Viewed 743606

I have some jQuery/JavaScript code that I want to run only when there is a hash (#) anchor link in a URL. How can you check for this character using JavaScript? I need a simple catch-all test that would detect URLs like these:

  • example.com/page.html#anchor
  • example.com/page.html#anotheranchor

Basically something along the lines of:

if (thereIsAHashInTheUrl) {
    do this;
} else {
    do this;
}
anchor fragment-identifier jquery javascript
20 Answers

Simple use of location hash:

if(window.location.hash) {
  // Fragment exists
} else {
  // Fragment doesn't exist
}
Gareth_315820

Put the following:

<script type="text/javascript">
    if (location.href.indexOf("#") != -1) {
        // Your code in here accessing the string like this
        // location.href.substr(location.href.indexOf("#"))
    }
</script>
user_371900

If the URI is not the document's location this snippet will do what you want.

var url = 'example.com/page.html#anchor',
    hash = url.split('#')[1];

if (hash) {
    alert(hash)
} else {
    // do something else
}
user_5464910

Have you tried this?

if (url.indexOf('#') !== -1) {
    // Url contains a #
}

(Where url is the URL you want to check, obviously.)

user_226560

You can parse urls using modern JS:

var my_url = new URL('http://www.google.sk/foo?boo=123#baz');

my_url.hash; // outputs "#baz"
my_url.pathname; // outputs "/moo"
​my_url.protocol; // "http:"
​my_url.search; // outputs "?doo=123"

urls with no hash will return empty string.

user_43221590

This is a simple way to test this for the current page URL:

  function checkHash(){
      return (location.hash ? true : false);
  }
user_78485290

I noticed that all of these answers mostly check window.location.hash and make it difficult to write tests.

 const hasHash = string => string.includes('#')

You can also remove the hash from a url like so:

const removeHash = string => {
 const [url] = string.split('#')
 return url
}

And finally you can combine the logic together:

if(hasHash(url)) {
 url = removeHash(url)
}
user_19646360
Related