想要使用 jQuery 选择器选择多个元素, 要怎么实现? 下面本篇文章就来给大家介绍 jQuery 选择器选择多个元素的方法, 希望对大家有所帮助.
在 jQuery 中, 可以使用以逗号 (,) 分隔的元素选择器列表 -- 多个元素选择器, 或 * 选择器来选择多个元素.
多个元素选择器可用于选取多个元素, 需要使用逗号分隔每个元素.
* 选择器选取文档中的所有元素, 包括 html,head 和 body. 如果 * 选择器与其他元素一起使用, 该选择器选取指定元素中的所有子元素.
语法:
多个元素选择器
$("element1,element2,element3,...")
* 选择器
$("*")
参数:
● element: 用于指定要选择的元素, 必需参数, 不可删除.
示例 1: 使用多个元素选择器
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="UTF-8">
- </head>
- <body>
- <h1 > 欢迎来的这里!</h1>
- <h2>Hello</h2>
- <p > 测试文本! p 元素</p>
- <div class="demo">
测试文本, 删除!
- <p > 测试文本, 删除! div 里的 p 元素</p>
- </div>
- <p > 测试文本! p 元素!<span>span 元素</span></p>
- <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
- <script>
- $(document).ready(function() {
- $("h2, div, span").CSS(
- "background-color", "plum");
- });
- </script>
- </body>
- </HTML>
效果图:
示例 2: 使用 * 选择器
- <!DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="UTF-8">
- </head>
- <body>
- <h1>
- 欢迎来的这里!
- </h1>
- <div class="demo">
- <h2>
- div 里的 h2 元素
- </h2>
- <p>
- 测试文本, 删除! div 里的 p 元素
- </p>
- <span>
- div 里的 span 元素
- </span>
- </div>
- <p>
- 测试文本! p 元素!
- </p>
- <script src="https://code.jquery.com/jquery-1.10.2.js">
- </script>
- <script>
- $(document).ready(function() {
- $("div *").CSS("background-color", "plum");
- });
- </script>
- </body>
- </HTML>
效果图:
来源: http://www.css88.com/qa/jquery/10485.html