如何动态设置HTML lang属性？

Question

如何在Web应用程序中动态设置HTML“ lang”属性？

我尝试使用jQuery如下插入'lang'属性：

$(document).ready(function() {
     $("html").attr("lang", language); //'language' value is retrieved from a cookie
}); 

使用控制台/警报，“ lang”属性看起来已按预期设置。但是，如果您看到生成的源（查看源），则根本不会设置“ lang”。

要求是屏幕阅读器必须能够动态识别语言。如果还有其他解决方案可以使屏幕阅读器动态识别该语言，那就太好了。谢谢大家的内联评论！

Answer 1

document.documentElement.setAttribute('lang', navigator.language);

或者

document.documentElement.lang = navigator.language;

Answer 2

但是，如果您看到生成的源代码（查看源代码），则根本没有设置 'lang'。

查看源代码不会向您显示生成的源代码。它向您展示了真正的来源。如果你想改变它，那么你需要在传递给浏览器之前在服务器上改变它。您不能使用客户端 JavaScript 修改它。

您的 DOM 更改将显示在实时 DOM 中，这将通过 Inspect Element 可见。

Answer 3

还不能发表评论。

我尝试了该片段，它对我有用。当然，我添加了一个字符串值而不是您的“语言”变量。

不要忘记在顶部菜单中导入 jQuery，以便它在代码片段中工作。