码迷,mamicode.com
首页 > Web开发 > 详细

Jquery基础教程第二版学习记录

时间:2015-07-28 12:25:21      阅读:139      评论:0      收藏:0      [点我收藏+]

标签:

本文仅为个人jquery基础的学习,简单的记录以备忘。

在线手册:http://www.php100.com/manual/jquery/
第一章:jquery入门
基础jquery知识:jquery能做什么;为什么需要jquery。

第二章:选择符
工厂函数$()
css选择符
属性选择符
自定义选择符
DOM遍历方法

第三章:事件
jQuery.noConflict([extreme]):运行这个函数将变量$的控制权让渡给第一个实现它的那个库。
常用方法:(包括键盘,鼠标事件)
blur([[data],fn]) change([[data],fn])
click([[data],fn]) dblclick([[data],fn])
error([[data],fn])
focus([[data],fn]) focusin([data],fn) focusout([data],fn)
keydown([[data],fn]) keypress([[data],fn]) keyup([[data],fn])
mousedown([[data],fn]) mouseenter([[data],fn]) mouseleave([[data],fn]) mousemove([[data],fn]) mouseout([[data],fn]) mouseover([[data],fn]) mouseup([[data],fn])
resize([[data],fn]) scroll([[data],fn])
select([[data],fn]) submit([[data],fn])
unload([[data],fn])

事件绑定,冒泡。。。参考文章:【http://kb.cnblogs.com/page/94469/ jQuery的.bind()、.live()和.delegate()之间区别_知识库_博客园】
事件处理:
on(eve,[sel],[data],fn) off(eve,[sel],[fn]) bind(type,[data],fn) unbind(type,[data|fn]) one(type,[data],fn)
trigger(type,[data]) triggerHandler(type, [data])
事件委派
live(type,[data],fn) die(type,[fn])
delegate(sel,[type],[data],fn) undelegate([sel,[type],fn])
阻止默认事件及停止传播:
preventDefault方法:阻止它的默认行为的发生而发生其他的事情
stopPropagation方法:阻止js事件冒泡的作用
通过.trigger()在每一个匹配的元素上触发某类事件。

第四章:效果
主要通过.css()和.animate()来渐进增强页面的功能
基本
show([speed,[easing],[fn]]) hide([speed,[easing],[fn]]) toggle([speed],[easing],[fn])
滑动
slideDown([spe],[eas],[fn]) slideUp([speed,[easing],[fn]]) slideToggle([speed],[easing],[fn])
淡入淡出
fadeIn([speed],[eas],[fn]) fadeOut([speed],[eas],[fn]) fadeTo([[spe],opa,[eas],[fn]]) fadeToggle([speed,[eas],[fn]])
自定义
animate(param,[spe],[e],[fn])
stop([cle],[jum])1.7* delay(duration,[queueName])

第五章:DOM操作
要在HTML中创建新元素,使用$()工厂函数
内部插入
append(content|fn) appendTo(content) prepend(content|fn) prependTo(content)
外部插入
after(content|fn) before(content|fn) insertAfter(content) insertBefore(content)
包裹
wrap(html|ele|fn) unwrap() wrapall(html|ele) wrapInner(html|ele|fn)
替换
replaceWith(content|fn) replaceAll(selector)
删除
empty() remove([expr]) detach([expr])
复制
clone([Even[,deepEven]])

第六章:AJAX
通过AJAX主要引入四种数据格式:HTML,JSON,Javascript,XML
ajax 请求
$.ajax(url,[settings]) load(url,[data],[callback]) $.getJSON(url,[data],[fn]) $.getScript(url,[callback])
$.get(url,[data],[fn],[type]) $.post(url,[data],[fn],[type])
ajax 状态方法
ajaxComplete(callback) ajaxError(callback) ajaxSend(callback) ajaxStart(callback) ajaxStop(callback) ajaxSuccess(callback)


第七章:表格操作
通过表格案例,介绍了jquery的使用。
1.表格的排序和分页
2.修改表格外观:突出显示行,工具提示条,折叠扩展,筛选

第八章:构建功能型表单
1.表单的前端验证(必填字段,内容格式验证)
2.ajax收索功能
3.兼容性的字段占位符
4.处理方向键(使用方向键选择)
5.对数字型表单的操作(购物车功能,修改件数,删除内容)

第九章:滑动和翻转
1.滑动显示新闻
2.ajax获取新闻,ajax的使用
3.图像传送带(点击滑动图像,放大镜效果,延迟加载动画)

第十章:使用插件
推荐插件:
表单类:

  • Autocomplete(用户填写文本输入时,显示可能的匹配列表),
  • Validation(基于各种标准验证表单输入字段),
  • jeditable(相应用户某些操作——如单击或双击时,将非表单元素转化为可以编辑的输入字段,修改后的内容可以自动发回服务器保存),
  • Masked input(为输入特定格式提供了便利,如日期、电话号码、邮编等)

表格类:

  • Tablesorter(把表格元素转化为无需刷新即可自动排列的表格),
  • jqGrid(ajax驱动的javascript控件,支持在web页面动态展示和操作表格数据),
  • Felxigrid(与jqGrid类似),

图像类:

  • jcrop(裁剪图像),
  • Magnify(放大镜效果,生成放大镜),

对话框类——功能都类似,弹出框,对话框;一般FancyBox比较常用

  • FancyBox, Thickbox, BlockUI, jqModal

图表类——功能类似,使用canvas生成图表

  • Flot, Sparklines,

事件类:

  • hoverIntent(与hover类似,但它可以根据用户鼠标指针移入或移除元素做出反应,特别适合下拉菜单动画),
  • Live query(与live类似)

第十一章:插件的制作
插件的制作,不过,这篇文章http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html更详细

Jquery基础教程第二版学习记录

标签:

原文地址:http://www.cnblogs.com/yldf55/p/4675947.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!