How to Get the Current Domain Name in JavaScript

This tutorial will show you how to get the current domain name in JavaScript (and more).

Published Categorized as JavaScript, Web Dev

Suppose you’re building a website or a web application and, for one reason or another, you need to get the current domain name in JavaScript.

What’s the best way to do that?

To get the value of the current domain name in JavaScript, reference the hostname property of the window.location object.

In this tutorial, I will show you exactly how to do that—and give you some of my best tips on how to work with it.

How It Works

If you opened up your browser’s console right now and referenced the following object:

// The hostname property of the window.location object
window.location.hostname

You would see that the hostname of this page is makersaid.com.

Were this domain name prefixed with “www,” the value of the hostname would have been www.makersaid.com.

The value of window.location.hostname is a USVString, which means a sequence of Unicode scalar values. (In our JavaScript code, we treat USVStrings as regular strings.)

Ways to Use It

Store It for Subsequent Use

Nine times out of ten, you will only need to reference the string and store it for future use in a constant or variable:

// Store value of hostname in a constant
const domainName = window.location.hostname

// Store value of hostname in a variable
var domainName = window.location.hostname

Split It Into an Array

However, you can also split the string into an array at every dot (.) with the String.prototype.split() method:

// Split value of hostname into an array
window.location.hostname.split('.')

Once again, if you fired up the browser’s console and gave this statement a spin, you’d get an array consisting of two values: ['makersaid', 'com'].

Were this domain name prefixed with “www,” the array would have consisted of three values: ['www', 'makersaid', 'com'].

Splitting the hostname property into data elements in an array can be useful if you’re developing business logic for multiple domain names and need clean values to determine the current domain name.

Clean It From a Prefix

You can even go further and check if your hostname has a prefix, such as ‘www,’ and erase that prefix from the array by using the Array.shift() method:

// Clean domain name value from 'www' or other prefix
function cleanDomain(removeValue) {
    var domainName = window.location.hostname.split('.');
    if (domainName.includes(removeValue)) {
        domainName.shift();
        console.log(domainName);
    }
    else {
        console.log(domainName);
    }
}

cleanDomain('www');

In Conclusion

Thank you for reading this far and I hope this tutorial helped you get the job done.

The window object in JavaScript has a number of useful read-only properties that can be useful in your daily work. I recommend you experiment with them and learn them, as using them can make your code faster and leaner.

Leave a comment

Your email address will not be published.