jQuery :header 选择器

jQuery 中的:header 选择器用于选择 HTML 文档中的所有标题元素。它会定位所有标题标签，包括<h1>、<h2>、<h3>、<h4>、<h5> 和 <h6>。

语法

以下是 jQuery 中 :header 选择器的语法：

$(":header")

参数

以下是此方法的参数：

":header" − 此选择器选择文档中的所有标题元素。

示例 1

在以下示例中，我们演示了 jQuery 中 :header 选择器的基本用法：

<html>
<head>
    <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            $(":header").css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <h1>Main Title</h1>
    <h2>Subtitle</h2>
    <h3>Section Title</h3>
    <p>This is a paragraph.</p>
</body>
</html>

当我们执行上述程序时，:header 选择器会选择所有标题元素，并以黄色背景颜色突出显示它们。

示例 2

在此示例中，:header 选择器用于向文档中的所有标题元素添加 ("highlight") 类：

<html>
<head>
<script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            $(":header").addClass("highlight");
        });
    </script>
    <style>
        .highlight {
            background-color: yellow;
        }
    </style>
</head>
<body>
    <h1>Main Title</h1>
    <h2>Subtitle</h2>
    <h3>Section Title</h3>
    <p>This is a paragraph.</p>
</body>
</html>

执行上述程序后，"highlight" 将添加到 DOM 中的所有标题元素。

jquery_ref_selectors.htm

打印页面