使用 jQuery 检测 html 语言

Question

我在 Wordpress 中使用了一个多语言插件，使用户能够在网站上更改他们的语言选项。

这个插件改变了 HTML 语言属性，例如

<html lang="en-GB">

或

<html lang="en-US">

我尝试使用以下选择器检测语言：

if ($( 'html:lang(en-us)')) {
    alert('US lang detected');
}

然而，这会产生误报，因为页面下方的其他元素被设置为 'en-us'，即使打开 HTML 属性设置为 'en-GB'。

哪个选择器会专门检查开头的 HTML 属性？

Answer 1

你可以把 lang 抓取为 attr，就像代码片段中的代码

console.log($("html").attr("lang"));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html lang="en">
<head></head>
  <body></body>
</html>

Answer 2

$('html[lang="en-us"]')

应该做。

Answer 3

您的选择器是正确的，但您在 if 语句中使用不正确。

$( 'html:lang(en-us)') 将 return 一个 jQuery 对象。 jQuery 对象始终为真，因此您的 if 语句将始终计算为真。

一个简单的修复方法是使用 .is 函数，它将 return 一个布尔值：

if ($('html').is(':lang(en-us)')) {
    alert('US lang detected');
}

Answer 4

您必须检查 length:

if ( $("html:lang(en-us)").length > 0 ) {
    alert( 'US lang detected' );
}

Answer 5

通过使用 jQuery 完成这样的任务，您可能会使事情变得不必要地复杂和缓慢：

if ( document.documentElement.lang.toLowerCase() === "en-us" ) {
    alert( "American English." );
}

Vanilla JavaScript 更适合读取属性值等琐碎任务

Answer 6

这在 WordPress 中对我有用

jQuery(document).ready(function($){ console.log("cons"); if ( $("html:lang(en)").length > 0 ) {
   alert( 'US lang detected' );
} });

Detect html lang with jQuery