获取浏览器语言的完美方案。(各浏览器对 navigator 对象中几个与语言相关的属性的返回值存在差异)

http://www.w3help.org/zh-cn/causes/BX2040

标准参考

问题描述

各浏览器对 navigator 对象中几个与语言相关的属性(language、userLanguage、browserLanguage、 systemLanguage)的返回值存在很大的差异。

造成的影响

由于不同浏览器对这几个属性的返回值有很大差异,同时返回的有效值的大小写也有差异。若在获取当前浏览器语言的时候没有考虑到这些差异则可能造成兼容性问题。

受影响的浏览器

所有浏览器  

问题分析

首先查看一下 navigator 对象中的这几个与 language 相关的属性。

navigator 对象包含有关浏览器的信息。没有应用于 navigator 对象的公开标准,不过所有浏览器都支持该对象。但是其内部一些属性及其返回值在各浏览器并不统一。

  • language:返回当前的浏览器语言(来自 Mozilla Developer Center)
  • userLanguage:返回操作系统设定的自然语言(来自 MSDN)
  • browserLanguage:返回当前的浏览器语言(来自 MSDN)
  • systemLanguage:返回当前操作系统的缺省语言(来自 MSDN)

关于 navigator 对象的更多资料,请参见:MSDN、Mozilla Developer Center。

对于浏览器,Mozilla Developer Center 中的 language 属性与 MSDN 中的 browserLanguage 属性描述很像。

分析以下代码:

代码中打印出了各浏览器对于这 4 个属性返回值的情况:

  IE6 IE7 IE8 Firefox Chrome Safari Opera
navigator.language undefined zh-CN zh-CN
navigator.userLanguage zh-cn undefined zh-cn
navigator.browserLanguage zh-cn undefined zh-cn
navigator.systemLanguage zh-cn undefined undefined

解决方案

可以使用下面的代码获取当前浏览器语言:

(navigator.language || navigator.browserLanguage).toLowerCase()


示例:<以下示例由博主吕津增加>

获取浏览器语言的完美方案。(各浏览器对 navigator 对象中几个与语言相关的属性的返回值存在差异)_第1张图片


PS:

如下图所示,navigator.browserLanguage、navigator.systemLanguage、navigator.userLanguage这三个属性对FireFox不支持。

http://www.w3school.com.cn/tiy/t.asp?f=hdom_navigator

获取浏览器语言的完美方案。(各浏览器对 navigator 对象中几个与语言相关的属性的返回值存在差异)_第2张图片

获取浏览器语言的完美方案。(各浏览器对 navigator 对象中几个与语言相关的属性的返回值存在差异)_第3张图片


你可能感兴趣的:(Web前端-Html/CSS)