初学jQuery--相关选择器

什么是jQuery？

JQuery实际上就是对现有的JavaScript的一种扩展，它非常轻量级，压缩后大概32KB，它兼容于各种浏览器，这样就可以非常方便地添加适用于多种浏览器的特效。 jQuery是由美国人John Resig最初创建的，经过几个版本的发展， 目前最新的版本是jQuery3.4.1。最重要的是它提供了相当健全的文档，便于广大jQuery爱好者进行学习。

jQuery的作用

jQuery本身是一个基于插件的JavaScript库，它的各种功能可以通过新的插件进行增强。jQuery为Web编程提供了一个抽象的层，使得它可以兼容于任何浏览器，并且大大简化了原先用JavaScript做的工作

jQuery库包含的功能:

HTML元素选取

HTML元素操作

CSS操作

HTML事件函数

JavaScript特效和动画

HTML DOM遍历和修改

AJAX

Utilities；

jQuery语法

jQuery语法是通过选取HTML元素，并对选取的元素执行某些操作。

*基本语法：$(selector).action()

美元符号定义 jQuery

选择符(selector)"查询"和"查找"HTML元素

jQuery的action()执行元素的操作

实例：

$(this).hide()-隐藏当前元素

$("p").hide()-隐藏所有<p>元素

$("p.test").hide()-隐藏所有class="text"的<p>元素

$("#test").hide()-隐藏id="test"的元素

相关选择器

• 一、基本选择器
• 1.#ID 选择器:根据 id 查找标签对象
• 2..class 选择器:根据 class 查找标签对象
• 3.element 选择器:根据标签名查找标签对象 * 选择器:表示任意的，所有的元素 selector1，selector2 组合选择器:合并选择器 1，选择器 2 的结果并返回 ...

 eg:

<script src="jquery.min.js"></script>
		<!--2.书写jQuery的代码-->
		<script type="text/javascript">
		<!--3.加载jQuery文档-->
			$(function() {
				//jQ选择器
				//#id
				var a1 = $("#d1");
				console.log(a1);
				//.class
				var b1 = $(".c1");
				console.log(b1);
				//标签选择器、
				var a2=$("p");
				console.log(a2);
				//过滤选择器
				var a3=$("ul>li:last")
				a3.css("color","red")
				//属性选择器
				var a6=$("a[target]")
				a6.css("color","red")
				
				<a href="https://www.baidu.com"> 超链接1</a>
			});
			
		</script>

• 二、层级选择器
• 1.ancestor descendant 后代选择器 :在给定的祖先元素下匹配所有的后代元素，即包括儿子元素，也包括孙子等其他元素 parent > child
• 2.子元素选择器:在给定的父元素下匹配所有的子元素，只包括儿子元素，不包括孙子等其他元素 
• 3.过滤选择器 3.1基本过滤选择器 :first 获取第一个元素 ...

• 4.表单选择器 :input 匹配所有 input标签元素 :text 匹配所有 文本输入框 ...