轻松玩转jQuery笔记.pdfVIP

第一部分 jQuery基础 最后导入的库对$有控制权，释放$控制权可以用 jQuery.noConflict();此后jQuery 中的$符号 要用jQuery 代替。例如：jQuery(‘h3’).click(function(){}); fadeOut(‘fast’/’slo ’); 淡出 fadeIn();//淡入 slideUp(‘fast’/’slo ’); 减小高度直至隐藏 slideDown(); 父元素、子元素、兄弟元素、祖先元素、后代元素。 父元素是直接位于一个元素之上的元素，子元素相反。子元素一定是后代元素，但后代元素 不一定是子元素。一个元素之上的所有元素都是该元素的祖先元素。父元素一定是祖先元素， 祖先元素不一定是父元素。 JS变量可以存放任何类型的数据，为了标记处存放jQuery 对象的变量，人为地在该变量前 面加上$。例如 var$test=$(‘h3’);vartestHTML=$test.html(); jQuery 对象和DOM对象的相互转换： 1.jQuery对象转成DOM对象 用get()方法，语法get([index]);index可以为负数，返回倒数第|index|个元素的DOM对象。 例如：$(‘li’).get();//不带参数会返回所有匹配元素的DOM对象，放在一个数组里。 例如：vartest=$(‘li’).get();alert(test[0].interHTML); vartest=$(‘li’).get(-1); 2.DOM对象转换成jQuery对象 用$()包起来即可。 例：var$test=$(document.getElementsByTagName(‘li’));$test.eq(0).html(); jQuery选择器 分类：基本选择器、过滤选择器、层次选择器、表单选择器 可以同时制定任意多个选择器并用，相连接，会将匹配到的元素合并到一个结果中，例如： $(‘h3,.hot,#id’) 选择h3、class属性为hot、id为id 的元素。 与element、#id选择器相比，.class选择器的执行效率低，可以把.class选择器和element选 择器配合在一起使用，显著提升搜索性能。例如：$(‘div.bottom’); 基本过滤选择器（index从0开始） :first、:last、:even偶数、:odd奇数、:eq()、:gt()、:lt()、:not(selector)、:header所有标题元 素、:animated 所有正在执行动画的元素 子元素过滤选择器（index从1开始） :first-child、:last-child、:only-child、:nth-child(odd)、:nth-child(even)、:nth-child(index)、:nth-child(e quation) 选取符合equation的子元素，例如 $(“p:nth-child(3n+)”); 内容过滤选择器 :contains(text) 选取含有文本内容为text 的元素 （包括后代元素含有text也算，大小写敏感） :has(selector) 选取含有后代元素为selector的元素 :parent 选取含有后代元素或文本的非空元素 :empty 选取不包含后代元素和文本的空元素 注：input、img、br、hr等标签天然地就属于不包含后代元素和文本的空元素 可见性过滤选择器 :hidden 选取不可见元素 :visible 选取可见元素 Display取值为none 的元素、属性type为hidden 的input元素、宽和高设置为0 的元素都 属于不可见元素。属性visibility取值为hidden 的元素虽然不可见，但是如果占据空间，则 依旧符合:visible选择器，并不会被:hidden选择器选中。 属性过滤选择器 [attr]选取使用attr属性的元素，例如：$(‘div[class]’); [attr=value]attr恰好单独包含value 的元素、[attr!=value]、[attr~=value]选取attr属性用空格 分隔的值中有一个为value 的元素，例如$(‘div[class~=top]’、[attr^=value]、[attr$=value]结束、 [attr*=value]包含value 的元素。 注：可以同时指定任意多个属性过滤选择器，例如 $(‘div[class=top’][id]’); 层次选择器 Selector1selector2 从1的后代元素里选取2