jQuery ``:lang()`` 选择器使用教程


发布日期 : 2024-01-01 07:34:58 UTC

访问量: 10 次浏览

jQuery :lang() 选择器

jQuery :lang 选择器是用来选择所有具有指定 lang 属性的元素。这个属性包含 single value language_code,用于指定内容的语言。
一些语言的例子是 "en" 代表英语,"es" 代表西班牙语等等。它需要一个完整的单词作为值,如 lang="en",或在后面加上一个连字符(-),如 lang="en-us"

语法

语法:

$(":lang(language)")

示例

例子1: 在这个例子中,我们将使用 jQuery :lang() 选择器来选择具有English lang 属性的元素。

<!DOCTYPE html>
<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>

    <script>
        $(document).ready(function () {
            $("p:lang(en)").css(
                "background-color", "coral");
        });
    </script>
</head>

<body>
    <center>
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
        <h2>jQuery :lang Selector</h2>
        <p>GeeksforGeeks</p>
        <p lang="en">
            A computer science portal for geeks.
        </p>
    </center>
</body>

</html>

输出:

jQuery :lang() 选择器

例子2: 在这个例子中,我们将借助点击功能改变具有英语语言属性的元素的颜色。

<!DOCTYPE html>
<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>

    <script>
        $(document).ready(function () {
            $("button").click(function () {
                $("p:lang(en)").css(
                    "color", "green");
            });
        });
    </script>
</head>

<body>
    <center>
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
        <h2>jQuery :lang Selector</h2>
        <p>GeeksforGeeks</p>
        <p lang="en">
            A computer science portal for geeks.
        </p>
        <button>Change color</button>
    </center>
</body>

</html>

输出:

jQuery :lang() 选择器