11 JQuery 高级

今日内容:

1. JQuery 高级
	1. 动画
	2. 遍历
	3. 事件绑定
	4. 案例
	5. 插件

JQuery 高级

1. 动画
	1. 三种方式显示和隐藏元素
		1. 默认显示和隐藏方式
			1. show([speed,[easing],[fn]])
				speed:动画的速度,三个与选项"slow" "normal" "fast"或者放毫秒值
				easing:指定切换效果,swing:先慢,再快,再慢 linear	匀速
                fn:回调函数,当动画执行完会自动调用该函数
			2. hide([speed,[easing],[fn]])
			3. toggle([speed],[easing],[fn])
		
		2. 滑动显示和隐藏方式
			1. slideDown([speed],[easing],[fn])
			2. slideUp([speed,[easing],[fn]])
			3. slideToggle([speed],[easing],[fn])

		3. 淡入淡出显示和隐藏方式
			1. fadeIn([speed],[easing],[fn])
			2. fadeOut([speed],[easing],[fn])
			3. fadeToggle([speed,[easing],[fn]])


2. 遍历
	1.js的遍历方法
		for(初始化值;循环条件;步长(i++))
			break 跳出for循环		continue	跳出本次循环
	2.jq的遍历方式
		1.jq.each(callback)
			返回值	
				true	相当于结束循环
				flase	相当于跳出循环		
		2.for..of():jquery3.0	以上可以用
		
3. 事件绑定
	1.jquery标准绑定方式
		js 	onclick	click()			onblur		blur()
		jq对象.事件方法(回调函数)
	2.on/off	绑定事件/接触绑定事件
		jq对象.on("事件名称",回调函数)
		jq对象.off("事件名称")
			*off()不写参数会怎样 解除该事件源上所有事件
    3.toogle	切换事件


4. 插件:增强JQuery的功能
	1. 实现方式:
		1. $.fn.extend(object) 
			* 增强通过Jquery获取的对象的功能  $("#id")
		2. $.extend(object)
			* 增强JQeury对象自身的功能  $/jQuery

事件监听机制:

* 概念:某些组件被执行了某些操作后,触发某些代码的执行。	
	* 事件:某些操作。如: 单击,双击,键盘按下了,鼠标移动了
	* 事件源:组件。如: 按钮 文本输入框...
	* 监听器:代码。
	* 注册监听:将事件,事件源,监听器结合在一起。 当事件源上发生了某个事件,则触发执行某个监听器代码。
* 常见的事件:
	1. 点击事件:
		1. onclick:单击事件
		2. ondblclick:双击事件
	2. 焦点事件
		1. onblur:失去焦点
		2. onfocus:元素获得焦点。

	3. 加载事件:
		1. onload:一张页面或一幅图像完成加载。

	4. 鼠标事件:
		1. onmousedown	鼠标按钮被按下。
		2. onmouseup	鼠标按键被松开。
		3. onmousemove	鼠标被移动。
		4. onmouseover	鼠标移到某元素之上。
		5. onmouseout	鼠标从某元素移开。


	5. 键盘事件:
       onkeydown	某个键盘按键被按下。	
       onkeyup		某个键盘按键被松开。
       onkeypress	某个键盘按键被按下并松开。

   	6. 选择和改变
   		1. onchange	域的内容被改变。
   		2. onselect	文本被选中。
   	
   	7. 表单事件:
   		1. onsubmit	确认按钮被点击。
   		2. onreset	重置按钮被点击。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值