HTML5程序设计基础教程第14章jQuery程序设计.pptVIP

HTML5程序设计根底教程第14章jQuery程序设计;第14章 jQuery程序设计 ;本章知识点;14.1 jQuery根底 ;下载jQuery ;下载jQuery ;初识jQuery ;【例14-1】 一个jQuery 编程的简单实例 ;实例说明如下 ;提示 ;【例14-2】 ;14.2 jQuery选择器 ;根底选择器 ;1．#Id ;2．使用标签名 ;3．根据元素的css类选择 ;【例14-3】 ;浏览【例14-3】的结果 ;4．选择所有HTML元素 ;【例14-4】 演示选择所有HTML元素的简单实例 ;浏览【例14-4】的结果 ;5．同时选择多个HTML元素 ;【例14-5】 ;浏览【例14-5】的结果 ;;1．ancestor descendant〔祖先 后代〕选择器;【例14-6】 ;浏览【例14-6】的结果 ;2．parent child〔父 子〕选择器 ;【例14-7】 ;接上;浏览【例14-7】的结果 ;3．prev + next〔前 + 后〕选择器 ;【例14-8】 ;浏览【例14-8】的结果 ;4．prev ～ siblings〔前 ～ 兄弟〕选择器;【例14-9】 ;接上;浏览【例14-9】的结果 ;根本过滤器 ;1．:first ;【例14-10】 ;浏览【例14-10】的结果 ;2．:last ;3．:not(选择器) ;4．:even ;5．:odd ;6． :eq(index) ;7． :gt(index) ;8． :lt(index) ;9． :header ;【例14-11】 ;浏览【例14-11】的结果 ;10． : animated ;;1．:contains() ;【例14-12】 ;浏览【例14-12】的结果 ;2．:empty() ;3．:has() ;4．:parent() ;【例14-13】 ;浏览【例14-13】的结果 ;;【例14-14】 ;浏览【例14-14】的结果 ;;1．[属性名] ;【例14-15】 ;浏览【例14-15】的结果 ;2．[属性名=值] ;【例14-16】 ;浏览【例14-16】的结果 ;3．[属性名!=值] ;4．[属性名^=值] ;5．[属性名$=值] ;6．[属性名*=值] ;7．复合属性过滤器 ;;1．:nth-child(index/even/odd/equation);【例14-17】 ;浏览【例14-17】的结果 ;2．:first-child;3．:last-child;4．:only-child;14.3 设置HTML元素的属性与CSS样式 ;;1．通过DOM对象访问HTML元素的属性 ;遍历元素 ;【例14-18】 ;2．使用attr()方法访问HTML元素的属性 ;【例14-19】 ;表单的常用属性及说明 ;3．使用removeAttr()方法删除HTML元素的属性 ;【例14-20】 ;4．使用text()方法设置HTML元素的文本内容 ;【例14-21】 ;;1．使用css()方法获取和设置CSS属性 ;2．与HTML类别有关的方法 ;【例14-22】 ;浏览【例14-22】的结果 ;３．获取和设置HTML元素的尺寸 ;【例14-23】 ;接上;浏览【例14-23】的结果 ;4．获取和设置元素的位置 ;5．滚动条相关 ;14.4 表单编程 ;;1．:input ;【例14-24】 演示:input选择器的简单实例 ;接上; 浏览【例14-24】的结果 ;2．:text ;【例14-25】 演示: text选择器的简单实例 ;接上;浏览【例14-25】的结果 ;3．:password ;4．:radio ;5．:checkbox ;6．:submit ;7．:image ;8．:reset ;9．:button ;10．:file ;;1．:enabled ;【例14-26】 演示:enabled过滤器的简单实例;浏览【例14-26】的结果 ;2．:disabled ;3．:checked ;【例14-27】 演示: checked过滤器的简单实例 ;接上;浏览【例14-27】的结果 ;4．:selected ;;1．blur()方法和focus()方法 ;提示 ;【例14-28】 ;【例14-29】 ;2．change()方法 ;提示 ;【例14-30】 演示change()方法简单实例 ;浏览【例14-30】的结果 ;3．select()方法 ;提示 ;4．submit()方法 ;提示 ;5．val()方法 ;【例14-31】 演示val()方法简单实例 ;14.5 事件和Event对象 ;;;【例14-32】 ;浏览【例14-32】的结果 ;【例14-33】 ;浏览【例14-33】的结