目录
1 jQuery 概述
1.1 为什么使用 jQuery
写最少的代码，办更多的事儿
jQuery是一个快速，小巧，功能丰富的JavaScript库。
jQuery 使HTML文档遍历和操作，事件处理和动画等操作变得更加简单。
jQuery的所有功能都是通过JavaScript访问的，因此掌握JavaScript对于理解，构建和调试代码至关
2 什么是 jQuery
3 jQuery 中$的含义
3.1 作用 1：$(function)
1.相当于 window.οnlοad=function(){}
2.功能比window.onload更强大
1) window onload一个页面只能写一个,但是可
以写多个$() 而不冲突
2) window onload要等整个页面加载完后再执行
（包括图片、超链接、音视频等），
但是$的执行时间要早
3.完整形式是$(document).ready(…….);
3.2 作用 2：$(selector)
选择器
jQuery具有强大的选择器功能
4 选择器学习
DOM对象：直接使用JavaScript获取的节点对象
className innerHTML value
jQuery对象：使用jQuery选择器获取的节点对象，它能够
使用jQuery中的方法
addClass() html() val()
DOM对象和jQuery对象分别拥有一套独立的方法，不能混用
DOM对象转换成jQuery对象
$(DOM对象)
jQuery对象转换成DOM对象
jQuery对象[index]
jQuery对象.get(index)
标签选择器 $(“a”)
ID选择器 $(“#id”)
$(“p#id”)
类选择器 $(“.class”)
$(“h2.class”)
通配选择器 $("*")
并集选择器$("elem1,elem2,elem3")
后代选择器$(ul li)
父子选择器 $(ul>li)
后面第一个兄弟元素 prev + next
后面所有的兄弟元素 prev ~ next
//只是第一行变颜色
$("ul li:first").css("background-color","red");
$("ul li").first().css("background-color","red");
//最后一行变颜色
$("ul li:last").css("background-color","green");
$("ul li").last().css("background-color","green");
//获得索引是奇数对象 索引从0开始
$("ul li:odd").css("background-color","green");
//获得索引是偶数对象 索引从0开始
$("ul li:even").css("background-color","green");
//获得索引下标位3的对象
$("ul li:eq(3)").css("background-color","green");
//获得大于指定索引下标的对象
$("ul li:gt(3)").css("background-color","green");
//获得小于指定索引下标的对象
$("ul li:lt(3)").css("background-color","green");
/**************子选择器*************************/
$("ul li:nth-child(1)").css("background-color","green");
$("ul li:first-child").css("background-color","darkred");
$("ul li:last-child").css("background-color","darkred");
$("ul li:only-child").css("background-color","#00A40C");
//type属性等于text
$("input[type=text]").css("background-color","#00A40C");
// name属性用z开头的
$("input[name^=z]").css("background-color","#FF0000");
// name属性同d结尾的
$("input[name$=d]").css("background-color","green");
//name属性中包含p 的元素
$("input[name*=p]").css("background-color","green");
//复合属性选择器，需要同时满足多个条件时使用
$("input[type=text][name^=z]").css("background-color","deeppink");
// √ 获得form表单中的所有的表单项
var inp= $(":input")
//获得标签名称是input 的所有的标签对象
var inp2=$("input");
alert(inp.length+"----"+inp2.length);
$("input[type=text]")
// √ input标签 type属性等于text所对应的对象
$(":text").css("background-color","green");
$(":password").css("background-color","red");
/************表单属性选择器*****************/
//获得input标签中含有disabled属性的对象
var but= $("input:disabled");
alert(but.val());
//√ 获得含有checked属性的对象
var ch =$("input:checked");