jQuery IN ACTION 小笔记

jQuery in Action 我的读书笔记

1.      $是jQuery的别名，所以$(“#idName”),其实就是jQuery（“#idName”）

2.      选择器可以联合使用

比如，以前我只知道可以用$(“#idName”)找到ID為“idName”的那些节点，用$(“.className”)找到class为“className”的那些节点，原来可以用$(“#idName.className”)把符合两个条件的找出来，害的我以前还要大循环里做条件匹配。

所以有$("body > div:has(a)")这样的组合出来，也就省事不少。

 3.      以前我们在处理页面的时候，往往要等到整个页面加载完了才会进行处理，所以会用到onload，但是onload要等所有的东西都加载完了才执行，谁知道Flash，QuickTime这些大家伙啥时候能够完全OK呀，其实只要节点加载完了就可以执行操作了，所以jQuery有了ready这个function。

jQuery(document).ready(function() {

$("div.notLongForThisWorld").hide();

});

 书上原话是“jQuery提供一个简单的方式就是等到DOM Tree加载完（而不是等待外部资源的加载）就立即执行代码。

4.      在jQuery中自定义函数，比如jQuery中并没有disabled一组元素的函数，但是我们又很想用，比如

$("form#myForm. input.special").disable();

那么我们可以立即去定义一个

$.fn.disable = function() {

   return this.each(function() {

      if (typeof this.disabled != "undefined") this.disabled = true;

   });

}

真的很方便.

5.  选择器实例

例子                描述

   a                                      选择所有的标签 a 元素

   #speicalID                    选择那些ID值为speicalID的元素

    .specialClass             选择那些Class值为specialClass的元素

a#specialId.specialClass  这个我就不说了

p a.specialClass                 同上

 

6.      $(“form. input”)和$(“form. > input”)虽然都是有包含关系，不过前者来的更随意些，后者只能是父子关系，而不是简单的包含关系，所以祖孙关系是不行的。

7.      匹配关系一览

*           Matches any element.

E          Matches all elements with tag name E.

E F       Matches all elements with tag name F that are descendents of E.

E>F      Matches all elements with tag name F that are direct children of E.

E+F     Matches all elements with tag name F that are immediately preceded by sibling E.

E~F     Matches all elements with tag name F preceded by any sibling E.

E.C      Matches all elements with tag name E with class name C. Omitting E is the same as *.C.

E#I      Matches all elements with tag name E with the id of I. Omitting E is the same as *.I.

E[A]     Matches all elements with tag name E that have attribute A of any value.

E[A=V] Matches all elements with tag name E that have attribute A whose value is exactly V.

E[A^=V] Matches all elements with tag name E that have attribute A whose value starts with V.

E[A$=V] Matches all elements with tag name E that have attribute A whose value ends with V.

E[A!=V] Matches all elements with tag name E that have attribute A whose value does not match the value V, or

that lack attribute A completely.

E[A*=V] Matches all elements with tag name E that have attribute A whose value contains V.

 8.      选择还可以使用位置参数

比如，a:first 即匹配第一个a，相应还有odd，even，last-child（包含关系时）

    :first The first match within the context. li a:first returns the first link that is a

              descendant of a list item.

   :last  The last match within the context. li a:first returns the last link that is a

             descendant of a list item.

   :first-child The first child element. lifers-child returns the first list item of each list.

   :last-child  The last child element. li:first-child returns the last list item of each list.

   :only-child  Returns all elements that have no siblings.

   :nth-child(n) The nth child element. li:nth-child(2) returns the second list item of each

                          list.

  :nth-child(even|odd) Even or odd children. li:nth-child(even) returns the even list items of each

                           list.

  :nth-child(Xn+Y) The nth child element computed by the supplied formula. If Y is 0, it may be omitted.

  li:nth-child(3n) returns every 3rd list item, whereas li:nthchild(5n+1) returns the item after every 5th element.

  :even Even elements. li:even returns every even list item.

  :odd Odd elements. li:odd returns every even list item.

  :eq(n) The nth matching element.

  :get(n) Matching elements after and excluding the nth matching element.

  :lt(n) Matching elements before and excluding the nth matching element.

 

9.      几个内容函数的区别

.html() 返回带有完整的html标签等

.text()  返回文本

.val()   返回属性value的值

来自 “ ITPUB博客 ” ，链接：http://blog.itpub.net/554557/viewspace-628653/，如需转载，请注明出处，否则将追究法律责任。

转载于:http://blog.itpub.net/554557/viewspace-628653/