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博客 ” ,链接:https://blog.itpub.net/554557/viewspace-628653/ ,如需转载,请注明出处,否则将追究法律责任。