How to Check For Hash (#) Value in a URL Using JavaScript

If you need to check if a URL has a hash value, you can do this using JavaScript very easily. Because JavaScript provides us a straightforward way to do this.

JavaScript has window.location.hash property that returns hash (#) value for the URL opened in the browser tab. This property can be used to check if the hash exists in the URL or not from its return value. If the return value is not an empty string that means the URL contains a hash.

You can also check for a hash value in a URL string using JavaScript if you need to. There are many JavaScript string methods to extract the value out of it.

Let's see how to use window.location.hash property and other string methods to check for a hash (#) value using JavaScript from the current URL and a URL string.

Check For Hash Value in Current URL Using JavaScript

You can access the current URL from your browser using window.location in JavaScript. There is a hash property in this object that returns a string containing a "#" from that URL.

To confirm if a URL has a hash or not, at first you have to get the hash value from the URL. You can get, remove, and change the hash from a URL using JavaScript.

For example, if you are visiting https://www.webmound.com/#check-hash-value URL in your browser. When you use window.location.hash property in JavaScript, you will get #check-hash-value from this property.

But if the URL like https://www.webmound.com/ doesn't have any hash value, it will return an empty string ("").

          const hash = window.location.hash;

if (hash) {
    console.log('URL has hash value');
} else {
    console.log('URL does not have hash value');
}
        

I am getting the hash value in this example. If the hash is not an empty string or a falsy value in JavaScript, the if condition will run. Otherwise, the else block will run.

In this way, we can confirm whether the current URL has a hash (#) value or not.

Also Read: How to Remove Elements From an Array in JavaScript

Check If a Hash (#) Value Exists in a URL String

You can check for a hash value from a URL string using JavaScript methods. You can use methods like split() or indexOf() to extract the hash from the URL.

If the method returns a valid value, that means the URL contains a hash value. But if it returns a falsy value then the URL doesn't have any hash value.

          const url = 'https://www.webmound.com/#check-hash-value';

const hash = url.split('#')[1];
// check-hash-value

if (hash) {
    console.log('URL has hash value');
} else {
    console.log('URL does not have hash value');
}

        

I am calling the split() method with "#" as its argument. It will give an array of sub-strings. The array will have two items if the URL has a hash value. The array will contain this value at index 1.

          ['https://www.webmound.com/', 'check-hash-value']
        

If the URL doesn't have any hash, the array will have only 1 item. In that case, the hash variable will be undefined.

Therefore, we can check whether the hash variable contains a valid value or it contains an undefined.

Alternatively, you can also use indexOf() instead of using split() method. It takes a string as its argument and returns the index of that string.

          const url = 'https://www.webmound.com/#check-hash-value';

if (url.indexOf('#') !== -1) {
    console.log('URL has hash value');
} else {
    console.log('URL does not have hash value');
}

        

When I call the indexOf() method on url with the "#" string, it will return the index of "#". If there is no "#" in the url then it will return -1.

Therefore, if url.indexOf('#') is not equal to -1, it means the url has a hash value. In this way, we can verify whether a URL string contains a hash or not.

Also Read: How to Open URL Using JavaScript in Same or New Tab/Window

Conclusion

It doesn't matter if you are working with the current URL opened in the browser or a URL string, you can find the hash value from that URL.

You can use window.location.has property in JavaScript for the current URLs in the browser. JavaScript methods like split() or indexOf() are used for a string.

By following these techniques, you can check for the hash (#) value in any URL using JavaScript.