菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 梁洁---20221122--jQuery第三天 [打印本页]

作者: 梁杰，你好 时间: 2022-11-22 23:52
标题: 梁洁---20221122--jQuery第三天
事件注册：
文档加载事件：
让网页中html的dom加载完成后再执行js代码
$(function(){})
$(document).ready(function(){});
原生
window.onload=function（）{}
window.daaEventListener("load",function(){})

$(document).ready();
$(function)
$().ready(function);
原生加载事件与jq对象记载事件的区别：
1、window。onload  只能执行一次  后面会覆盖前面的
2、window.addEventListener()事件监听，可以多次使用，不会被覆盖
3、$(function(){})可以多次使用，不会被覆盖
4、$(document).ready(function(){});可以多次使用，不会被覆盖
5、$().ready(function(){});可以多次使用，不会被覆盖

1、原生的不可以简写
2、原生的onload只能使用一次，jq可以多次使用

普通事件绑定：
jq对象.on("事件名"，function（）{});
简写 jq对象.事件类型（function（）{}）
jq对象.blind"事件名"，function（）{});
jq对象.live("事件名"，function（）{});
jq对象.delegate("事件名"，function（）{});
注册事件的分类：
1对1：一个事件源，一个事件类型，一个事件处理函数
1对多：一个事件源。多个事件类型，一个事件处理函数
多对一：一个事件源，多个事件类型，不同事件处理函数
事件委托：
事件委派，事件委托，事件代理，事件分发
注册事件的时候，将事件注册到父级，由父级来分配事件给子元素
语法
父元素.on(不带on的时间类型，"新添加的后代元素",function(){
});
注销事件：
on绑定---off（）注销
blind（）绑定---unblind（）注销

jq对象.off();注销所有的时间
jq对象（“需要注销的事件1 事件2”）；
空间命名：相同事件需要多次进行注册的时候，事件类型.别名
合成事件：
jq对象.hover(移入事件，移出事件);
事件对象：
event：事件对象
事件处理函数的第一个事件
evebt.target:事件源
event.type 事件类型
event.pageX
event.pageY
阻止浏览器默认行为：event.preventDefault();
阻止冒泡：event.stopPropagation();

jq动画：
分类：
内置动画：
三组
1、显示、隐藏
show  hide
2、划入画出
slideDown
slideUp
sildeToggle
3、淡入淡出
fadeIn
fadeOut
fadeToggle

自定义动画
概念：自定义动画表示自己定义的动画
语法：jq对象.animate(parmas，speed，easing，fn);参数之间需要用逗号隔
parmas：第一个对象，需要执行的动画属性。不是所有的属性都可以实现动画效果开
speed：动画时长:毫秒
easing:运动曲线
fn回调函数
停止动画
jq对象.stop(参数1，参数2);
1、参数1：停止当前动画，是否执行后面的动画
2、参数2：停止当前动画，是否把当前的动画状态拉倒结束状态

尺寸  位置  卷曲
浏览器的显示高度和宽度
$(window).width();
$(window).height();
文档流的宽高
$(document).width();
$(document).height();
如果出现滚动条的话：document的宽高就会发生变化，文档流的实际宽高
获取某个节点的宽高
width  hehight  ：content宽高不包含border padding  margin
innerWidth（） innerHeight（）包含  padding content
outerWidth（） outerHeight 包含padding  content border
偏移
offset（）返回值是对象
top距离浏览器顶部分距离--搜索栏。书签栏下面开始氨酸器
left距离浏览器左侧的距离

卷曲
scrollTop（）；

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)