欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

jquery

程序员文章站 2024-03-05 20:42:25
...

学习目标:1.什么是JQuery2.JQuery设计思想3.JQuery常用方法4.JQuery下的Cookie缓存和ajax一、什么是JQuery
* 什么是JQ?
一个优秀的JS库,大型开发必备。

* JQ的好处?
		1. 简化JS的复杂操作
		2. 不再需要关心兼容性
		3. 提供大量实用方法

* 如何学习JQ?
		1. www.jquery.com  JQ的官方网站
		2. JQ只是辅助工具,要正确面对
		3. 需要分阶段学习  

二、JQuery设计思想
–模拟css选择元素
–独有表达式
jquery
–多种筛选方式

* 选择网页元素
  1. 模拟css选择元素 请参阅我们的 CSS 选择器参考手册。http://www.runoob.com/cssref/css-selectors.html2. 独有表达式选择3. 多种筛选方法

    • JQuery写法
    • JQuery中没有=号
      1.方法函数化
      jquery
  2. 链式操作
    jquery

  3. 取值赋值合体
    jquery

  4. 方法函数化

  5. 链式操作

  6. 取值赋值合体

  • JQ与JS的关系
    可以共存,不能混用。

三、JQuery常用方法

	$()下的常用方法
	• has()
	• not()
	• filter()
	• next()找到兄弟节点中的下一个节点
	• prev()找到兄弟节点中的上一个节点
	• find()查找子节点
	• eq()
	• index()
	• attr()
	
$()下的常用方法
• addClass()添加class名    removeClass()删除class名
• width() width    innerWidth()width+padding    outerWidth() width + border + padding
outerWidth(turn) width + border + padding
• insertBefore()   before()
• insertAfter()      after()
• appendTo()       append()
• prependTo()     prepend()
• remove() 删除节点
• on() off()
• scrollTop() 获取当前的滚动高度

jquery
on
jquery

	$()下的常用方法
	• ev clientX pageX which
	• preventDefault stopPropagation
	• one()
	• offset() 获取当前元素距可视文档的距离 position() 计算距离最近的一个有定位的父级距离
	• offsetParent()找到从当前节点开始,第一个有定位的父级
	• val()  去值赋值一体  input标签的内容
	• size() 返回获取元素的个数
	• each()  遍历   一个参数是下标   第二个参数是元素

whichjquery

	$()下的常用方法
	• hover( ) 第一个参数funcOver   第一个参数funcOut
	• show()         hide()
	• fadeIn() 淡入       fadeOut() 淡出
	• fadeTo()
	• slideDown() slideUp()  卷闸效果

jquery

	基础方法扩充
	• get(): 下标和length属性
	• outerWidth(): 针对隐藏元素和参数true
	• text(): 合体的特例 获取当前标签和子标签中的纯文本
	• remove() 不会保留行为,detach() 会保留行为   两个都是删除节点
	• $(), $(document).ready() 当整个页面(document)加载完之后运行

	$()下的常用方法
	元素节点操作
	• parents()获取所有的祖先节点 其中的参数是筛选条件closest()必须有参数找到所有祖先节点中 第一个符合条件的元素(自己也算)
	• siblings() 找到除自己以外所有的节点参数可以传筛选条件
	• nextAll() 找到当前节点开始往下所有的兄弟节点参数可以传筛选条件
	 prevAll()找到当前节点开始往上所有的兄弟节点参数可以传筛选条件
	• parentsUntil()  找到当前节点开始往上父级某个节点位置为止
	nextUntil() 找到当前节点开始往下某个节点位置为止
	prevUntil()找到当前节点开始往下某个节点位置为止
	• clone() 直接调用不会克隆行为
	clone(true)会克隆行为
	• wrap() 每一个元素外面包装  参数是字符串,标签
	wrapAll() 包在一个元素里面整体包装
	 wrapInner() 内部包装
	 unwrap() 去除包装
	• add() slice()
	• serialize() serializeArray()

jquery

	$()下的常用方法
	• animate()
	• stop() 结束当前正在运动的动画  stop(true)结束所有动画
	stop(true true)结束所有动画 并让运动的动画直接到达目的值
	stop(finish)结束所有动画 并让所有动画直接到达目的值
	• delay() 延迟
	• delegate() undelegate() • trigger()
	• ev.data ev.target (兼容后触发对象) ev.type (输出事件类型 a)

jquery

animate
    运动形式  默认  慢快慢
    参数传在时间之后  swing 慢快慢 
     linear  匀速
凡是调用animate前面必须写stop

jquery
jquery

jquery

相关标签: jq jQuery