jQuery入门基础（一）：基础语法及选择器

基本语法形式

$(selector).action{

}

页面加载完执行：

$(document).ready(function{

})

简写成：

$(function{

})

选择器：

#id; element; .class; selector1,selector2.....; *

 

层次选择器：

ancestor decendant //根据祖先元素匹配子孙元素

parent>child //根据父元素匹配子元素

prev+next //匹配所有在prev之后的相邻元素——可以用.next代替

prev~siblings //匹配prev之后的所有兄弟元素，可以用nextAll代替

 

过滤选择器：

:first //获取第一个元素

:last //获取最后一个元素

:not(selector);//除了括号里选择器之外的其他元素

:even //索引号为偶数的元素，索引从0开始

:odd //索引号为奇数的元素，索引从0开始

:header //获取所有标题元素(h1)(h2)……

:gt(index) //获取大于括号中索引号的元素，索引从0开始

:lt(index) //小于

:animated //获取所有在执行动画效果的元素

//内容

:contains(text) // 获取含有括号内文本的元素

:empty// 获取没有子元素或没有文本内容的元素

:has(selector) // 包含括号内元素的父元素

:parent // 获取所有含有子元素和文本的父元素

//可见性

:hidden //获取所有不可见元素，包括type为hidden的元素

:visible //获取所有可见元素

e.g

$(function(){
   ("div:hidden").show();
   ("div:visible").addClass("GetFocus")
})

//属性

[attribute] //获取含有特定属性的元素

[attribute=value] //获取特定属性等于特定值的元素

[attribute!=value] //不等于特定值

[attribute^=value] //属性是以某些值开始的元素

[attribute*=value] //结尾

e.g
$(function(){
    $("div[id]").show(3000);
    $("div[title='A']").show(3000); 
　　$("div[id='divAB'][title='A']").show(3000)
})

//子元素

:nth-child(index) //索引号从1开始，获取每个父元素下的特定子元素

:first-child //获取每个父元素下的第一个子元素

:last-child //获取每个父元素下的最后一个子元素

:only-child //获取每个父元素下的仅有一个子元素

$(function(){
   $("li:nth-child(2)).addClass("GetFocus");
   $("li:first-child").addClass("GetFocus"); 
})

//表单对象

:enabled //获取表单中所有可用元素

:disenabled //获取表单中所有不可用元素

:checked //获取表单中所有被选中的元素

:selected //获取表单中option被选中的元素

$(function(){
   $("#divA ").show(3000);
   $("#form1 input:enabled").addClass("GetFocus");  
})

//表单

:input

:text //单行文本

:checkbox //复选框

:button //按钮

:submit //

:image //

:radio //单选按钮

:file //文件域

:reset //

:password //密码框