JS中如何使用选择器选择多个元素

作者：andy0012019.12.10来源：Web前端之家浏览：23987评论:0

关键词：js 选择器

在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>

赏您的支持是我们创作的动力！