How to detect the browser language preference using JavaScript ?

Detecting the language preference of users can be very important for Websites or Web Apps to increase user interaction. By using JavaScript, this task can be easily done by using:

Languages property is available for the navigator interface, which returns the most preferred / user-preferred language set in the web browser. This property is read-only.

Syntax:

navigator.languages 

// Or

navigator.language

Return Value:

• The navigator.languages property will return an array that stores the languages in an order in which the language most preferred by the user will be the first element.
• The navigator.language property will return the first element of the array which is returned by the navigator.languages property i.e. the most preferred user language.

Note: Language property is a read-only property, thus it is only possible for us to get the value, we cannot make changes to the user preferred language.

Example 1: Getting the most preferred language.

Javascript

<script>
    var usrlang = navigator.language
            || navigator.userLanguage;
    console.log(
        "User's preferred language is: "
        + usrlang);
</script>

Output:

User's preferred language is: en-US

Example 2: Getting the preferred language array.

Javascript

<script>
    var usrlang = navigator.languages;
    console.log(usrlang);
</script>

Output:

['en-US', 'en']
0:"en-US"
1:"en"
length
:2

My Personal Notes arrow_drop_up

Save