jQuery选择器使用纪要

大雷！

已于 2022-07-07 17:15:11 修改

阅读量120

点赞数

分类专栏：笔记前后台交互文章标签： jQuery 选择器

于 2018-04-01 23:42:00 首次发布

本文链接：https://blog.csdn.net/dalei9243/article/details/79774953

版权

笔记同时被 2 个专栏收录

70 篇文章 0 订阅

订阅专栏

前后台交互

5 篇文章 0 订阅

订阅专栏

1. :nth-child(paream)

	作用: 选择父元素下不限类型的指定子元素;(可以指定索引位,也可以奇偶匹配,也可以算数计算)

	语法: :nth-child(n|even|odd|formula)
	参数说明: 
		n: 要匹配元素的索引位(必须是数字,起始位为1);
		even: 子元素的偶数集;
		odd: 子元素的奇数集;
		formula: 规定哪个子元素需通过公式 (an + b) 来选取。
		(实例：p:nth-child(3n+2) 选取每个第三段，从第二个子元素开始。)

	Demo:

<!DOCTYPE html>
<html>
<head>

	<meta charset="utf-8">
	<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>

	<script>
		$(document).ready(function(){
		  $("p:nth-child(odd)").css("background-color","yellow");
		});
	</script>

</head>
<body>

	<div style="border:1px solid;">
		
		<p>1</p>
		<p>2</p>
		<p>3</p>
		<p>4</p>
		<p>5</p>

	</div>

</body>
</html>

2. $("#").val()
	
	作用: 获取指定id的元素节点value值;

	特点: ...

	语法: $("#").val();

	Demo: ....

3. $("#").remove()
	
	作用: 清空指定id的元素节点下的所有子元素节点,事件和对应的value值;

	特点: 清空,删除;

	语法: $("#").remove();

	Demo: ....

4. $("#").detach()
	
	作用: 移除指定id的元素节节点,但是保留对应的事件和数据;

	特点: ...

	语法: $("#").detach();

	Demo: ....

5. $("#").empty()
	
	作用: 清空指定id的元素节节点数据内容;

	特点: ...

	语法: $("#").empty();

	Demo: ....

6. $("#").html()
	
	作用: 返回或设置被选元素的内容;

	特点: 
		1. 带参数为设置参数内容;
		2. 不带参数为获取指定元素节点的内容;

	语法: $("#").html();

	Demo: ....

7. $("#").append()
	
	作用: 追加内容到指定元素节点之后;

	特点: ...

	语法: $("#").append();

	Demo: ....

8. $("#").next()
	
	作用: 选择指定元素节点的下一个同胞节点;

	特点: ...

	语法: $("#").next();

	Demo: ....

今天插入一段新的语法：通过JQuery的选择器来设置或者控制样式。
（以往一直用，场景比较多。习以为常，偶尔回来用发现语法会忘记）
// 设置select下拉选择框禁止选用。
$("#refund_payType").css("pointer-events", "none");
// 恢复select下拉选择框的正常使用。
$("#refund_payType").css("pointer-events", "visible");