Jquery 笔记

$("#fool") 和 jQuery("#fool") 是等价的，前者是简写形式。


$(document).ready(function(){
//...
})
类似于javascript的window.onload，但是window.onload必须等待网页中的所有内容都加载完毕后（包括图片）才能执行，而$(document).ready()的执行时机是网页中的所有的DOM结构绘制完毕后就执行，可能DOM元素关联的东西并没有加载完。


$(document).ready(function(){
//..
})
可以简写成
$(function(){
//..
})


jQuery对象就是通过jQuery包装DOM对象后产生的对象，不能使用DOM对象的方法，如$("#id").checked的写法是错误的，应使用$("#id").attr("checked")
var $variable = jQuery对象
var variable  = DOM对象
jQuery 和 DOM对象的相互转化


var $cr = $("#cr")
var cr = $cr[0]


var cr = document.getElementById("cr")
var $cr = $(cr)
$()是jQuery对象的制造工厂，平时用到的jQuery对象都是通过$()函数制造出来的


$("#tt").css("color","red")   //无需判断$("#tt")是否存在
因此当要用jQuery来检查某个元素在网页上是否存在时应该根据获取到的元素长度来判断
if($("#tt").length > 0){
//do something
}


jQuery基本选择器
#id                 $("#test")
.class              $(".test")
element             $("p")
*                   $("*")                      //选取所有的元素
selector1,2...      $("div,span,p.myclass")     //选取所有<div>,<span>和拥有class为myClass的<p>标签的一组元素


jQuery层次选择器
$("ancestor descendant")    $("div span") //选取<div>里的所有<span>元素
$("parent>child")           $("div>span") //选取<div>下的所有<span>元素，和上面有区别，只下一层的<span>
$("prev + next")            $(".one+div") //选取class为one的下一个同辈的<div>元素                           等价$(".one").next("div")
$("prev~siblings")          $(".one~div") //选取class为one的后面所有同辈<div>元素                           等价$(".one").nextAll("div")


jQuery过滤选择器
:first                      $("div:first") //选取所有<div>元素的第1个<div>元素
:last
....
//其它过滤选择器参见jQuery在线手册    http://www.php100.com/manual/jquery/


jQuery内容过滤选择器
:contains(text)             $("div:contains('me')") //选取含有文本‘me’的<div>元素
:empty                      $("div:empty")          //选取不包含子元素（包含文本元素）的<div>空元素
:has(selector)              $("div:has(p)")         //选取含有<p>元素的<div>元素
:parent                     $("div:parent")         //选取拥有子元素（包含文本元素）的<div>元素


jQuery属性过滤器
[attribute]                 $("div[id]")            //选取拥有属性id的<div>元素
...
//其它内容过滤选择器参见jQuery在线手册 


jQuery子元素过滤选择器


jQUery表单对象过滤选择器
:enabled                    $("#form1 :enabled")          //选取id为"form1"的表单内的所有可用元素
:disable                    $("#from1 :disabled")         //选取id为"form1"的表单内的所有不可用元素
:checked                    $("input:checked")           //选取所有被选中的<input>元素
:selected                   $("select option:selected")  //选取所有被选中的选项元素


jQuery表单选择器
:input
//其它内容过滤选择器参见jQuery在线手册