jQuery小笔记

找到元素后用 attr()方法来获取它的各种属性值    遍历用each()

选择器：.css("background","blue")  css(属性,值)

 

基本选择器：1，#id 用法 $(“#idName”)  2,Element元素  用法 $(“div”)

   3，.class 用法 $(“.classNmae”)  4, * 通配符  用法 $(“*”)  5,并列 用法 $(“span,#id”)

 

层次选择器：

//改变body内的所有div  body div   用法 $("body div").css("background","blue");

 //改变body内 子div   body > div      用法 $("body > div")

 //改变id为one的下一个 div   #one + div  用法 $("#one + div")

 //改变id为two的后面所有 兄弟div    #two ~ div  用法 $("#two ~ div")

 //改变id为two的所有 兄弟div $("#two").siblings("div").css 用法 $("#two").siblings("div").css(

 

基础过虑选择器：都是以：开头

 1. :first 匹配第一个元素 用法 $(“div:first”)  2,  :last  匹配最后一个元素

 3. :not(selector)   用法 $(“div:not(.one)”)   改变所有class不为one的div元素

 4. :even 改变为偶数的元素从0开始  5.  :odd 改变为奇数的元素

 6. :gt(idex)  用法$(“div:gt(3)”) 改变索引值大于3的div元素

 7. :eq(idex)  等于    8. :lt(idex) 小于 LT   9. :header 用法$(“:header”)匹配h1等标题

 10. :animated匹配所有正在执行动画效果的元素 $(“:animated”) 固定写法

 

内容过滤选择器：都是以：开头

1.  :contains(text) 匹配包含给定文本的元素  $(“div:contains(‘it’)”) 改变含有文本it的div
2.  :empty  匹配不包含子元素或者文本的 空元素    $(“div:empty”)
3.  :has(selector) 匹配含有选择器的元素 $(“div: has(.on)”)含有class为on元素的div元素
4.  :parent  含有子元素或者文本的元素   $(“div:parent”)   与empty相反
5.  $(“div:no(:contains(‘it’))”) 改变不含文本it的div

 

可见度过虑选择器：都是以：开头

:visible 匹配所有可见元素    隐藏的有display：none 和 input type=”hidden”

 :hidden  匹配不可见元素   $(“div:hidden”).show().css() 不可见的用show()方法使其可见

   选择所有文本隐藏域，并打印出他们的值----------

      $(“#b4”).click(function(){

       Var $inputHidden=$(“input:hidden”); //获取所有的隐藏域

        // each()以每个匹配的元素来执行一个函数

 $inputHidden.each(function(index,data){ 

//或者用$.each($inputHidden,function(index,data){});

       alert($(data).val()); //alert($(this).val());

//index 每次遍历的索引  data当前的对象 在循环中等价this       });});

 

属性过虑选择器：

1：含有属性title的div元素  $(“div[title]”)

2：含有属性title值等于test的div元素 $(“div[title=’test’]”)

3：属性title值不等于test的div元素(没有属性title的也被选中) $(“div[title!=’test’]”)

4：同上但(没有属性title的不被选中) $(“div[title][title!=’test’]”) 或$(“div[title]:not(title=’test’)”)

5：属性title值以te开头的div元素 $(“div[title^=’te’]”)

6：属性title值以te结束的div元素 $(“div[title$=’te’]”)

7：属性title值中包含te的div元素 $(“div[title*=’te’]”)

8： 选取有属性id的div元素，再选取其属性title值中包含te的div元素 $(“div[id][title*=’te’]”)

 

子元素过滤器：都是以：开头

每个class为one的div父元素下的第二个子元素   $(“div[class=’one’] :nth-child(2)”)

每个class为one的div父元素下的第一个子元素   $(“div[class=’one’] :first-child”)

每个class为one的div父元素下的最后一个子元素 $(“div[class=’one’] :last-child”)

每个class为one的div仅仅只有一个子元素       $(“div[class=’one’] :only-child”)