1.基本选择器：
id $("#id名")
类名 $(".类名")
标签名 $("标签名")
属性名 $("[属性名=属性值]")
2.伪类选择器：
first-child 第一个
last-child 最后一个
nth-child() 第几个
empty 清空
3.筛选器：
first 第一个
last 最后一个
eq(下标) 第几个
gt(下标) 大于第几个
lt(下标) 小于第几个
odd 偶数个
even 奇数个
4.表单元素选择：
$(":text") 选中所有的文本框
:password
:reset
:button
:submit
:checkbox
:image
:hidden
5.表单对象选择器：
$("input:disabled") 选中禁用项的input
$("input:enabled") 选中可用的input
$("input:checked") 被选中的单选框或复选框
$("option:selected") 被选中的下拉框
6.筛选器方法：
lis.eq(1) eq方法表示筛选到指定下标的元素
lis.first() 从伪数组中找到第一个
lis.last() 从选中的所有元素中筛选出最后一个
last.prev() 筛选到元素的上一个
prev.next() 筛选到元素的下一个
last.siblings() 选中所有兄弟
$("li").eq(2).prevAll() 前面所有的兄弟
$("li").eq(2).nextAll() 后面所有的兄弟
$("li:last").parent() 父元素
$("li:last").parents() 找到所有的祖宗
zuzong.find("ul") 从所有元素中找到指定的一个
ul.children() 所有的子元素
7.事件：
$("#btn").click(function(){
点击事件
})
$(window).load(function(){
当前页面所有资源加载完成再加载本事件
})
$(document).ready(function(){
当前页面所有资源加载完成再加载本事件
})
$(function(){
当前页面所有资源加载完成再加载本事件
})
on方法可以做事件委托 - 第二个参数是委托的元素
$(".box").on("click",".small",function(){
console.log(123);
})
on方法可以给执行的函数传参 - on方法的第三个参数是一个数组，数组中的数据会绑定在事件对象上，作为data属性的值
$(".box").on("click",".small",[1,2],function(e){
console.log(e);
jquery事件的事件对象，是没有兼容问题的
})
二合一的事件：将鼠标移入和鼠标移出的事件作为一个事件 hover
$(".box").hover(function(){
移入的时候触发
console.log("进来了");
},function(){
移出的时候触发
console.log("出去了");
})
解绑事件 off
$("#btn").click(function(){
$(".box").off("click",a);
})
8.JQ的属性操作：
获取属性 - 元素.attr(属性名)
设置属性 - 元素.attr(属性名,属性值)
删除属性 - 元素.removeAttr(属性名)
操作属性的另一个方法 - prop
prop操作的是元素的自带属性
// 获取
input.prop("name","username");
// 设置
div.prop("aaa",111); // 设置以后在标签上看不到
// 删除
div.removeProp("aaa")
9.JQ的样式操作：
获取样式 - 使用css方法 元素.css(css属性名)， 无论是行内的、内联的、外联的都能获取到
// var res = $("div").css("width");
// 设置单个样式 - 使用css方法 元素.css(css属性名,属性值);
$("div").css("border","10px solid #000");
设置多个样式 - 使用css方法 元素.css({属性名:属性值,属性名:属性值,...});
10.JQ的类名操作：
添加类名 addClass
删除类名 removeClass
添加和删除之间切换 toggleClass
判断标签是否有某个类名 hasClass
11.JQ节点创作：
添加到父元素中
append：父元素.append(新元素) - 将子元素追加到父元素的末尾
appendTo：新元素.appendTo(父元素) - 将子元素追加到父元素的末尾
prepend：父元素.prepend(新元素) - 将子元素添加到父元素的开头
prependTo：新元素.prependTo(父元素) - 将子元素添加到父元素的开头
添加成兄弟元素
before：旧元素.before(新元素) - 将新元素添加到旧元素的前面，形成兄弟关系
insertBefore：新元素.insertBefore(旧元素) - 将新元素添加到旧元素的前面，形成兄弟关系
after：旧元素.after(新元素) - 将新元素添加到旧元素的后面，形成兄弟关系
insertAfter：新元素.insertAfter(旧元素) - 将新元素添加到旧元素的后面，形成兄弟关系
替换-删除
replaceWith：旧元素.replaceWith(新元素) - 使用新元素替换旧的元素
relpaceAll：新元素.replaceAll(旧元素) - 新元素替换旧元素
empty：父元素.empty() - 将父元素中的所有内容(不管是文本还是标签，不管是子元素还是后代元素)都清空
remove：父元素.remove() - 将自己以及自己内容的所有内容都清空
节点的复制
元素.clone() - jquery的复制是将标签和里面的内容都复制出来了
clone方法有参数，第一个参数是布尔值，true表示复制大盒子的事件
clone方法的第二个参数是布尔值，表示是否复制子节点的事件
第一个参数也是可选项，默认是false
第二个参数是可选项，默认值是跟随第一个参数
如果不复制父节点的事件，也是不能复制子节点事件的 - 要复制子节点的事件，必须复制父节点的事件
12.元素尺寸：
获取设置的宽高：width() height()
获取包含内填充的宽高：innerWidth() innerHeight()
获取包含边框的宽高：outerWidth() outerHeight()
获取包含外边距的宽高：outerWidth(true) outerHeight(true)
设置宽高
$("div").width(200);
$("div").height(300);
$("div").innerWidth(200);
$("div").innerHeight(300);
$("div").outerWidth(200);
$("div").outerHeight(300);
13.元素的位置：
获取位置
获取相对于浏览器的绝对位置-offset：元素.offset()
返回一个包含left和top的对象
获取相对于设置过定位的父元素的位置-position：元素.position()
返回一个包含left和top的对象 - 位置不包含margin外边距
如果父元素都没有设置过定位，获取到相对于html的位置
设置位置：
元素.offset(对象) - 这个对象必须包含left或top，值是一个数字
设置的是一个目标值，元素，会操作left和top，如果没有定位会自动加一个相对定位
滚动过的距离：
滚动过的距离 scrollLeft() scrollTop()
这个方法要由$(window)
如果传参数就是设置，不传参数就是获取
在jquery中获取/设置滚动过的距离不存在兼容性问题，不管文档声明在不在，效果都一样
14.JQ请求方式：
get请求的语法： $.get(url,参数,回调函数,期望返回的数据格式)
post请求：$.post(url,参数,回调函数,期望返回的数据格式)
ajax请求：$.ajax({url,参数,成功的回调函数,失败的回调函数，...})
$.ajax({
url:"",
data:{
},
type:"",
dataType:"",
success:function(res){
},
error:function(){
},
cache:false // 是否要缓存，默认是true，是要缓存
});
jsonp请求：
$.ajax({
url:"",
data:{
},
dataType:"jsonp",
success:function(res){
console.log(res);
},
jsonp:"cb", // 请求携带的回调函数的键 script src="demo.php?cb=fn"
jsonpCallback:"fn" // 最终要调用的函数名称
});
function fn(res){
console.log("这是函数，返回值是"+res);
}
15.JQ的全局函数：
// 1.全局中第一个ajax将要开始的时候会触发的函数
$(window).ajaxStart(function(){
console.log("第一个ajax即将开始");
});
// 2.全局中每个ajax将要send的时候会触发的函数
$(window).ajaxSend(function(){
console.log("一个ajax即将发送");
});
// 3.全局中每个ajax执行完成后会触发的函数
$(window).ajaxComplete(function(){
console.log("一个ajax完成了");
})
// 4.全局中每个ajax执行成功的时候会触发的函数
$(window).ajaxSuccess(function(){
console.log("一个ajax成功了");
});
// 5.全局中每个ajax执行失败的时候会触发的函数
$(window).ajaxError(function(){
console.log("一个ajax失败了");
});
// 6.全局中最后一个ajax请求完成后会触发的函数
$(window).ajaxStop(function(){
console.log("最后一个ajax完成了");
});
16.JQ的控制权：
jQuery.noConflict(); // 将$符号的使用权交出
jQuery.noConflict(true); // 在方法中加true，会将jQuery这个关键字的使用权也交出，然后返回一个新的jQuery函数
17.JQ的扩展：
1.给jquery对象使用
$.fn.extend({
fn:function(){
console.log(123);
}
});
$("body").fn();
2.给jquery自己使用
$.extend({
fn:function(){
console.log(123);
},
noRepeat:function(arr){
var brr = [arr[0]];
for(var i=1;i var flag = true; for(var j=0;j if(arr[i]==brr[j]){ flag = false; break; } } if(flag){ brr.push(arr[i]); } } return brr; } });