首页 > 代码库 > 《锋利的Jquery》

《锋利的Jquery》

一.Js及库的异同和作用。

 1.JQuery的代码风格:

链式操作风格。对于同一对象操作不超过三个,可以写成一行;对于较多操作的对象,每行一个操作;对于多对象少量操作,可以每个对象些一行,子对象缩进;

代码注释。//.....

2.JQuery对象和DOM对象:

JQuery对象和DOM对象之间的转化。var $cr=$("#cr")----->var cr=$cr[0];

DOM对象和JQuery对象之间的转化。$()包起来;

 JQuery判断:is(":checked"){... ...};

3.解决JQuery与其他库的冲突: (待查)

4.插件

Aptana

EditorPlus

二.选择器。

1.css选择器

类选择器。div.myClass{... ...};

群组选择器。div.myClass,h1,h2,h3,p{... ...};

后代选择器。div.myClass ul li{... ...}

通配选择符。*{... ...}

伪类选择器。:nth-child;

 

 

2.JQuery选择器

基本选择器。$("#test"){... ...};$(".test"){... ... };$("*"){... ...};

层次选择器。$(div span"){... ... }所有的;$(div >span"){... ... }特定的;$(.one +div"){... ... }下一个div的同辈元素;$(.two ~div"){... ... }后的所有div元素;

过滤选择器。

a.基本过滤 :first; :last;  :even;  :odd;  :not(selector);$("input:gt(1)")//lt小于;  :header;:animated//正在动画的所有元素; :focus//当前聚焦的所有元素;

b.内容过滤  :contain(text);empty; $("div:has(p)"); $("div:parent);

c.可见性过滤 :hidden;:visiable;

d.属性过滤器  [];$("div[id]");

e.子元素过滤  :nth-child;only-child; :nth-child(odd); :nth-child(even);

f.表单对象属性过滤选择器 :enabled; selected; :checked;disabled;

表单选择器。

:input;  :checkBox; :file; :image;

 

三.DOM操作。

DOM核心

HTML-DOM

CSS-DOM

 

四.JQuery事件和动画。

1.加载DOM。在JS中通常使用window.onload();网页中所有元素都加载到浏览器中才执行;在Jquery中,使用$(document).ready();方法,这样可以在载入时就可以对其操纵并绑定其所有的函数,并不意味着关联函数被下载运用。

2.事件邦定。

3.改变邦定事件的类型

4.简写邦定事件

5.合成事件 hover(enter,leave) 光标悬停事件; toggle ()鼠标连续点击事件;

 

 

 

a.JQuery事件

b.JQuery动画

五.文本框,下拉框,复选框,表格变色

六.AJAX

七.插件

a.表单验证插件

b.表单插件

c.遮罩插件

d.Cookie插件

e.UI插件

八.个性网站

九.JQuery Mobile

十.版本变化

十一.性能优化