| 一、今日学习内容 jQuery文档加载事件 $(function(){ }) $(document).ready(function){ }) dom节点加载完成后再来执行 原生文档加载事件 window.onload=function(){ } window.addEventListener('load',function(){ }) jQuery文档加载事件：让网页中htmlDOM加载完成后执行js代码 $(function(){ }) $(document).ready(function){ }) $().ready(function(){ }) 原生加载事件与jq加载事件的区别 原生的不可以简写，jq可以 原生的onload一个网页中使能使用一次，jq可以多次使用 jQuery普通事件绑定 on()---重点 bind() live() delegate() jQuery事件注册 注册事件的分类 一对一：一个事件源，一个事件类型，一个事件处理函数 一对多：一个事件源，多个事件类型，一个事件处理函数 多对一：一个事件源，多个事件类型，不同事件处理函数 事件委派 概念：事件委派、事件委托、事件代理、事件分发 注册事件时，把事件注册到父级，由父级来分配给子元素 语法： 父元素.on('不带on的事件类型'，'新添加的后代元素'，事件处理函数) 注销事件 on()----off() jq对象.off()：注销所有事件 jq对象.off('事件1 事件2')：注销事件1和2 bind()---unbind() 合成事件 jq对象.hover(移入事件，移出事件) 事件对象 event---事件对象：事件处理函数的第一个参数 event.target：事件源 event.type：事件类型 event.pageX pageY：鼠标坐标 阻止浏览器默认行为：event.preventDefault() 阻止冒泡：event.stopPropagation() jQuery动画 内置动画 三组： 1.显示/隐藏--show()/hide() 2.滑入/滑出--slideDown()/slideUp() 切换：slideToggle() 3.淡入/淡出--fadeIn()/fadeOut() 切换：fadeToggle() 自定义动画 概念：自定义动画表示自己写的动画 语法：jq对象.animate(parmas,speed,easing,fn) parmas：是一个对象，需要执行动画的属性，不是所有属性都可以实现动画效果 speed：动画时长---毫秒 easing：动画类型---linear fn：回调函数 停止动画 jq对象.stop(参数1，参数2) 1.参数1：停止当前动画，是否结束后面的动画 2.参数2：停止当前动画，是都把当前动画直接拉到结束状态 jQuery中的尺寸、位置、卷曲 尺寸：获取浏览器窗口显示区域的宽高 width()/height()---box-sizing:border-box;padding,border是不包含 innerWidth()/innerHeight()---content+padding：不包含 outerWidth()/outerHeight()---content+padding+border 卷曲： scrollTop()---滚动条距离浏览器顶端距离 scrollLeft()---滚动条距离浏览器左边间距 偏移： offset()---偏移 |
| 欢迎光临 菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/) | Powered by Discuz! X3.4 |