jQuery层次选择器

最新推荐文章于 2022-02-26 12:02:53 发布

qq_45926670

最新推荐文章于 2022-02-26 12:02:53 发布

阅读量64

点赞数

本文链接：https://blog.csdn.net/qq_45926670/article/details/105144350

版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>
<script type="text/javascript">

	$(function(){
		//层次选择器 4个:
		/*
		后代选择器: 在给定的祖先元素下匹配所有的后代元素  父元素 子孙元素 (空格) 
		子元素选择器: 在给定的祖先元素下匹配直接的子元素  parent > child 
		相邻兄弟选择器: 匹配所有紧接在 prev 元素后的 (一个)next  元素  prev + next 
		同级兄弟选择器: 匹配所有在 prev元素后的所有siblings元素  prev ~ siblings 
		*/
		
		 var input = $("form input");// 所有后代
		 var input = $("form > input");// 子元素
		 var input = $("#lable1 ~ input");// 相邻兄弟
		 console.debug(input);
	
	})
	
	
</script>
</head>
<body>
<form>
  <input name="before" />
  <label id="lable1">Name:</label>
  <input name="name" />
  <fieldset>
      <label>Newsletter:</label>
      <input name="newsletter" />
 </fieldset>
 <input name="other" />
</form>
<input name="none" />

</body>
</html>