jQuery prev~siblings选择器

最新推荐文章于 2019-10-27 20:40:07 发布

ttcyan

最新推荐文章于 2019-10-27 20:40:07 发布

阅读量657

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/cyanciel/article/details/54095047

JavaScript 同时被 2 个专栏收录

41 篇文章

订阅专栏

jQuery

21 篇文章

订阅专栏

本文介绍如何利用jQuery选择器来操作HTML文档中特定元素的同级元素，并通过实例展示了如何为表单之后的所有同级输入元素添加背景色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>prev ~ sibling</title>
</head>
	<script src="jquery-1.11.3.min.js">
	</script>
<body>
	<!--
		匹配 prev 元素的所有同辈 siblings 元素
		prev:任何有效的选择器
		siblings:prev选择器的同辈选择器
	-->
	<form>
	  <label>Name:</label>
		  <input name="name" />
		  <fieldset>
		      <label>Newsletter:</label>
		      <input name="newsletter" />
		 </fieldset>
	</form>
	<input name="none" />
	<span>brother</span>
	<div>sister</div>
</body>
<script type="text/javascript">
        //如果指定sibling的名字，那么就只是会找寻指定名字的prev的同胞
       $('form~input').css('background','orange');
       //如果没有指定具体的名字，那么就会匹配所有是prev选择器同胞选择器
       $('form~').css('background','orange');
</script>
</html>