一.jquery等价于$

jquery选择器继承了css选择器的风格。
$("#ID")代替了document.getElementById()函数,即通过id获取元素。
$("tagName")代替document.getElementsByTagName()函数,通过标签名获取html元素
$()获取的永远是对象,即使网页上没有此元素,因此当要用jquery检查某个元素在网页上是否存在时,不用使用判断语句
if($("#tt")){   }
而是应该根据获取到元素的长度来判断:if($("#tt").length>0){   }
或者转化成dom对象来判断:
if($("#tt")[0]){    }
二.选择器
   分为基本选择器,层次选择器,过滤选择器和表单选择器。
(1).基本选择器
 最常用的选择器,通过id class 和标签名等来查找dom元素。
$("#test")    $(".test")  $("p")   $("*")
       $("div,span,p.myClass")选取所有的div span和拥有class为myclass的p标签的一组元素。
(2).层次选择器
  通过dom元素之间的层次关系来获取特定元素,例如后代元素,子元素,相邻元素和兄弟元素等,
 例子:$("div span")选取div里的所有的span元素
   $("div > span")   div元素下元素名为span的子元素
           $('.one+div')class为one的下一个div元素    经常被next()方法代替
     $(".one").next("div")
    $('#two~div')id为two的元素后面的所有div兄弟元素
$("#two").nextAll("div")
            siblings( )方法与前后位置无关,只要是同辈节点就都能匹配
(3).过滤选择器
通过特定的过滤规则来筛选出所需的dom元素,过滤规则可分为基本过滤,内容过滤,可见性过滤,子元素过滤盒表单对象属性过滤
1.基本过滤选择器
:first第一个元素
:last最后一个元素
:not(selector)取出所有与给定选择器匹配的元素
:even选取索引时偶数的所有元素,从0开始
:odd同上奇数
:eq(index)索引等于index的元素
:gt(index)大于index的元素
:lt(index)小于.......
:header所有标题元素,h1,h2,h3等等
:animated 当前正在执行动画的所有元素
       2.内容过滤选择器
体现在它所包含的子元素或文本内容上。
:contains(text)   含有文本内容为text的元素    例子:$("div:contains('我')")  含有文本“我”的div元素
:empty    不包含子元素或文本的空元素     $("div:empty")不包含子元素的div空元素
:has(selector)含有选择器所匹配的元素的元素   $("div:has(p)")含有p元素的div元素
:parent含有子元素或文本的元素  $("div:parent")拥有子元素的div元素
3.可见性过滤选择器
    根据元素的可见和不可见状态来选择相应的元素。
:hidden    选取所有不可见的元素   需要注意不仅包括样式属性display为none的元素,也包括文本隐藏域<input type="hidden">和visibility:hidden之类的元素
:visible    选取所有可见的元素
    4.属性过滤选择器
通过元素的属性来获取相应的元素
$("div[id]")选取拥有属性id的元素
$("div[title=test]")   选取属性title为test的div元素
$("div[title!=test]")   不等于
$("div[title^=test]")   以test开头的
$("div[title$=test]")   以test结束的
$("div[title*=test]")含有test的..
[selector1][selector2][selectorN]复合选择器   例如:$("div[id][title$='test']")   拥有属性id并且属性title以test结束 的div元素   
5.子元素过滤选择器
       :nth-child(index/even/odd/equation)选取每个父元素下的第index个子元素或者奇偶元素
例子:$('div.one:nth-child(2)')选择每个class为one的div父元素下的第2个子元素的背景色
                  :nth-child(3n)每个父元素下的索引值是3的倍数的元素
  :nth-child(3n+1)索引值是3n+1的 元素
       :first-child每个父元素的第一个子元素  
:last-child  ..........最后一个子元素
:only-child   一个父元素仅有一个子元素  则选择这个子元素
6.表单对象属性过滤选择器
:enabled   所有可用的元素
:disabled   所有不可用元素
:checked  所有被选中的元素  单选框   复选框   input元素
:selected  所有被选中的选项元素   下拉列表    选项元素
(4)表单选择器
:input
:text
:password
:radio
:checkbox
:submit
:image
:reset
:button
:file  所有的上传域
:hidden
例子:想得到表单内表单元素的个数$("#form1:input").length
5.选择器的注意事项
posted on 2017-11-27 10:14  学习记录园  阅读(125)  评论(0编辑  收藏  举报