今日所学内容:jQuery-day03
1.jq事件注册
2.jq动画
1.jq文档加载事件
$(function(){ })
$(document).ready(function(){ })
1.原生文档加载事件
window.onload = function(){ }
window.addEventLististener('load',function(){ })
2.jq文档加载事件:让网页中htmlDOM加载完成之后,就可以执行js代码
$(document).ready(function(){ })
$(function(){ })
$().ready(function(){ })
3.面试题:原生加载事件与jq加载事件的区别:
1.原生的不可以简写,jq可以
2.原生的onload一个网页中只能使用一次,jq可以多次使用
2.jq普通事件绑定---重点
on()---重点
bind()
live()
delegate()
1.1注册事件的分类
分类:
一对一:一个事件源,一个事实类型,一个事件处理函数
一对多:一个事件源,多个事实类型,一个事件处理函数
多对一:一个事件源,多个事件类型,多个事件处理函数
1.2事件委派---重点掌握
概念:事件委派,事件委托,事件代理,事件分发
注册事件时,把事件注册到父级,由父级来分配任务给子元素
语法:
父元素.on('不带on的事件类型','新添加的后代元素',事件处理函数)
1.3注销事件---理解
on()---off()
bind()---unbind()
jq对象.off():注销所有的事件
jq对象.off('事件1 事件2')
1.4合成事件----了解
jq对象.hover(移入事件,移出事件)
1.5事件对象
event---时间对象:事件处理函数的第一个参数
event.target:事件源
event.type:事件类型
evebt.pageX pageY:鼠标坐标
阻止浏览器默认行为:event.preventDefault();
阻止冒泡:event.stopPropagation();
2.jq动画
2.1分类
内置动画
自定义动画
2.2内置动画---了解
三组:
1.显示/隐藏
2.滑入/滑出
3.淡入/淡出
2.3自定义动画---重点
概念:自定义动画表示自己写的动画
语法:jq对象.animate(parmas,speed,easing,fn)
parmas:是一个对象,需要执行动画的属性,不是所有属性都有可以实现动画效果
speed:动画时长---毫秒
easing:动画类型---linear
fn:回调函数
2.4停止动画
jq对象.stop(参数1,参数2)
1.参数1:停止当前动画
2.参数2:停止当前动画,是否把当前动画直接拉到结束状态
3.jq中的尺寸、位置、卷曲
width();
|