JQuery幻灯片.ppt

PHP100 视频教程 演讲老师：张恩民 官方网站： (第107讲) JQuery 之选择器、事件器详解 学习重点 1、Jquery选择器的各种用法 2、Jquery事件器的介绍 PHP100 视频教程 (第107讲) JQuery 之选择器、事件器详解 1、Jquery选择器的各种用法 $(this) 当前元素 $(p) 所有p元素 $(input) 所有input元素 $(.intro) 所有 class=“intro” 的元素 $(ro) 所有 class=intro 的p元素 $(#intro) id=intro 的第一个元素 $(ul li) ul下的所有li节点 $(ul li:first) 每个 ul 的第一个 li 元素 $([href$=.jpg]) 所有带有以 .jpg 结尾的 href 属性的属性 $(div#intro .head) id=intro 的 div 元素中的所有 class=head 的元素 $(li[a:contains(Register)]) 内容包含Register的a元素 $(input[@name=bar]) name是bar的input元素 $(input[@type=radio][@checked]) type是radio的input元素 $(“li”).not(“ul”) li下没有包含ul节点的节点元素 $(span[@id]) 包含id属性的span元素 $([@id=span1]) id为span1的节点元素 PHP100 视频教程 (第107讲) JQuery 之选择器、事件器详解 2、Jquery事件器的介绍 基本用法 $(selector).click() 被选元素的点击事件 $(selector).dblclick() 被选元素的双击事件 $(selector).focus() 被选元素的获得焦点事件 $(selector).mouseover() 被选元素的鼠标悬停事件 $(selector).css(); 被选元素的CSS事件 $(selector). hide(); 被选元素的隐藏事件 $(selector). show(slow); 被选元素的显示事件 …… $(元素). 事件( 事件属性); 常见事件 PHP100 视频教程 (第107讲) JQuery 之选择器、事件器详解 $(“a”).addClass(“red”) 为所有a增加class=”red” $(“a”).removeClass(“red”) 为所有a去掉class=”red” $(“li”).append(“BB!”) 为li增加”BB!”innerHTML Dom节点操作 //hover是在执行完第一个函数后再执行第二个 $(“p”).hover(function(){ $(this).addClass(hover); },function(){ $(this).removeClass(hover); }); //toggle第一次点击执行第一个函数，再点击执行第二个 $(“p”).toggle(function(){ $(this).addClass(selected); },function(){ $(this).removeClass(selected); }); 执行事件 PHP100 视频教程 (第107讲) JQuery 之选择器、事件器详解 感谢收看本次教程，有什么疑问可以到 WWW.PHP100.COM 论坛提出