jquery经常使用总结

一。选择器优先级：
1.最高优先级是 (直接在标签中的设置样式，假设级别为1000)<div style="color:Red;"></div>
2.次优先级是（ID选择器 ,假设级别为100） #myDiv{color:Red;}
3.其次优先级是（类选择器，假设级别为10） .divClass{color:Red;}
4.最后优先级是 （标签选择器，假设级别是 1） div{color:Red;}
5.那么后代选择器的优先级就能够计算了啊
好比 .divClass span { color:Red;} 优先级别就是：10+1=11

二。jquery优先级
jquery 是没有优先级的，jquery是按照你的条件遍历一次DOM tree，因此写条件的时候最好尽可能缩小范围和用ID，避免要遍历所有DOM，这样效率是最快的
好比$('#idA')，$('div .classA')，$('.classA')，效率最好的是$('#idA')，而$('div .classA')又比$('.classA')的效率高，最后一个效率是最低的，由于jquery会遍历整个TREE

三。jquery选择器
元素选择器
$("p.xxx") 选取全部class="intro"的<p>元素
$("p#demo") 选取全部id="demo"的<p>元素
$(".intro.demo")全部 class="intro" 且 class="demo" 的元素
$("p:first") 第一个 <p> 元素
$("p:last") 最后一个 <p> 元素
$("tr:even") 全部偶数 <tr> 元素
$("tr:odd") 全部奇数 <tr> 元素
$("ul li:eq(3)") 列表中的第四个元素（index 从 0 开始）
$("ul li:gt(3)") 列出 index 大于 3 的元素
$("ul li:lt(3)") 列出 index 小于 3 的元素
$("input:not(:empty)") 全部不为空的 input 元素
$(":header") 全部标题元素 <h1> - <h6>
$(":contains('W3School')") 包含指定字符串的全部元素
$(":empty") 无子（元素）节点的全部元素
$("p:hidden") 全部隐藏的 <p> 元素
$("table:visible") 全部可见的表格
$("th,td,.intro") 全部带有匹配选择的元素
$("[href]") 全部带有 href 属性的元素
$(":input") 全部 <input> 元素
$(":radio") 全部 type="radio" 的 <input> 元素（radio可换成text,submit...）
$(":enabled") 全部激活的 input 元素
$(":disabled") 全部禁用的 input 元素
$(":selected") 全部被选取的 input 元素
$(":checked") 全部被选中的 input 元素
属性选择器
$("[href]") 选取全部带href属性的元素
$("[href='#']")选取全部带有href值等于#的元素
$("[href！='#']")选取全部带有href值不等于#的元素
$("[href$='.jpg']")选取全部href值以".jpg"结尾的元素

CSS选择器
$("p").css("background-color", "red");

$("ul li:first")每一个<ul>的第一个<li>元素
$("div#xxx .yyy")id="xxx" 的 <div> 元素中的全部 class="yyy" 的元素

四。jquery事件
$(document).ready(function(){});
$("button").click(function(){}); 触发或将函数绑定到被选元素的点击事件
$("#xxx").val();
$("#xxx").text();
$("#xxx").html();
var jq=jQuery.noConflict();用本身的名称（好比 jq）来代替 $ 符号。
$(selector).dblclick(function);触发或将函数绑定到被选元素的双击事件
$(selector).focus(function)触发或将函数绑定到被选元素的得到焦点事件
$(selector).mouseover(function)触发或将函数绑定到被选元素的鼠标悬停事件

五。效果
1.显示隐藏
$("p").hide();
$("p").show();
$("p").toggle();显示被隐藏的元素，并隐藏已显示的元素：
$(selector).toggle(speed,callback);可选的 speed 参数规定隐藏/显示的速度，能够取如下值："slow"、"fast" 或毫秒。
可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。
2.下面是四个淡入淡出，可选参数speed,callback：
fadeIn()
fadeOut()
fadeToggle()
$(selector).fadeTo(speed,opacity,callback);容许渐变为给定的不透明度（值介于 0 与 1 之间）。
3.滑动
$(selector).slideDown(speed,callback);下
$(selector).slideUp(speed,callback);上
$(selector).slideToggle(speed,callback);若是上就下，下就上
4.动画
$(selector).animate({params},speed,callback);
必需的 params 参数定义造成动画的 CSS 属性。
例：$("button").click(function(){
$("div").animate({left:'250px'});
});
复杂一点：
$("button").click(function(){
$("div").animate({
left:'250px',
opacity:'0.5',
height:'150px',
width:'150px'
});
});
使用相对值
$("button").click(function(){
$("div").animate({
left:'250px',
height:'+=150px',
width:'+=150px'
});
});
预约义值
$("button").click(function(){
$("div").animate({
height:'toggle'或者"show"、"hide"
});
});
队列
$("button").click(function(){
var div=$("div");
div.animate({height:'300px',opacity:'0.4'},"slow");
div.animate({width:'300px',opacity:'0.8'},"slow");
div.animate({height:'100px',opacity:'0.4'},"slow");
div.animate({width:'100px',opacity:'0.8'},"slow");
});
5.
$(selector).stop(stopAll,goToEnd); 方法用于中止动画或效果，在它们完成以前
可选的 stopAll 参数规定是否应该清除动画队列。默认是 false，即仅中止活动的动画，容许任何排入队列的动画向后执行。
可选的 goToEnd 参数规定是否当即完成当前动画。默认是 false。
6.chain
Chaining 容许咱们在一条语句中容许多个 jQuery 方法（在相同的元素上）。
$("#p1").css("color","red").slideUp(2000).slideDown(2000);

六。ajax
url
type
timeout
async 全部请求均为异步请求。若是须要发送同步请求，请将此选项设置为false
cache
data
dataType xml,html,script,json,jsonp,text
beforeSend 要求为Function类型的参数，发送请求前能够修改XMLHttpRequest对象的函数，例如添加自定义HTTP头
complete 要求为Function类型的参数，请求完成后调用的回调函数（请求成功或失败时均调用）
success 请求成功后调用的回调函数，有两个参数。(1)由服务器返回，并根据dataType参数进行处理后的数据。(2)描述状态的字符串。
error 请求失败时被调用的函数。该函数有3个参数，即XMLHttpRequest对象、错误信息、捕获的错误对象(可选)
contentType 当发送信息至服务器时，内容编码类型默认为"application/x-www-form-urlencoded"。
dataFilter 给Ajax返回的原始数据进行预处理的函数。提供data和type两个参数
global 默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局ajax事件，ajaxStart或ajaxStop可用于控制各类ajax事件。
ifModified 默认为false。仅在服务器数据改变时获取新数据。服务器数据改变判断的依据是Last-Modified头信息。默认值是false，即忽略头信息。
jsonp
username
password
processData
scriptCharset

$.each()以一个数组或者对象做为第1个参数，以一个回调函数做为第2个参数。回调函数拥有两个参数：第1个为对象的成员或数组的索引，第2个为对应变量或内容。

七。添加元素
append() - 在被选元素的结尾插入内容 $("p").append(txt1,txt2,txt3);
prepend() - 在被选元素的开头插入内容
after() - 在被选元素以后插入内容
before() - 在被选元素以前插入内容

八。遍历
parent() 方法返回被选元素的直接父元素。
parents() 方法返回被选元素的全部祖先元素，它一路向上直到文档的根元素 (<html>)。
parentsUntil() 方法返回介于两个给定元素之间的全部祖先元素。$("span").parentsUntil("div");
children() 方法返回被选元素的全部直接子元素
find() 方法返回被选元素的后代元素，一路向下直到最后一个后代
siblings() 方法返回被选元素的全部同胞元素。
next() 方法返回被选元素的下一个同胞元素。
nextAll() 方法返回被选元素的全部跟随的同胞元素
nextUntil() 方法返回介于两个给定参数之间的全部跟随的同胞元素
prev(), prevAll() 以及 prevUntil() 方法的工做方式与上面的方法相似，只不过方向相反而已：
first() 方法返回被选元素的首个元素。
last() 方法返回被选元素的最后一个元素。
eq() 方法返回被选元素中带有指定索引号的元素。
filter() 方法容许您规定一个标准。不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回$("p").filter(".intro");返回带有类名 "intro" 的全部 <p> 元素：
not() 方法返回不匹配标准的全部元素。

九。通配符
*=包含xx $= 以xx结束 ^=以xx开始

十。获取以及设置
$("#test1").text(function(i,origText){
return "Old text: " + origText + " New text: Hello world!
(index: " + i + ")";
});
});
html();
val();
attr();
十一。删除
empty() 方法删除被选元素的子元素
remove() 方法也可接受一个参数，容许您对被删元素进行过滤。$("p").remove(".italic");删除全部clss="italic"的全部p
十二。样式
addClass() - 向被选元素添加一个或多个类
removeClass() - 从被选元素删除一个或多个类
toggleClass() - 对被选元素进行添加/删除类的切换操做
css() - 设置或返回样式属性
css({"propertyname":"value","propertyname":"value",...});

十三。尺寸width()height()innerWidth()innerHeight()outerWidth()outerHeight()十四。ajax1.$(selector).load(URL,data,callback);从服务器加载数据，并把返回的数据放入被选元素中。$("#btn1").click(function(){$('#test').load('/example/jquery/demo_test.txt');})$("#div1").load("demo_test.txt #p1");把 "demo_test.txt" 文件中 id="p1" 的元素的内容，加载到指定的 <div> 元素中：可选的 callback 参数规定当 load() 方法完成后所要容许的回调函数。回调函数能够设置不一样的参数：responseTxt - 包含调用成功时的结果内容statusTXT - 包含调用的状态xhr - 包含 XMLHttpRequest 对象2.$.get(URL,callback);经过 HTTP GET 请求从服务器上请求数据。3.$.post(URL,data,callback);经过 HTTP POST 请求从服务器上请求数据。