- 博客(11)
- 收藏
- 关注
RSS订阅原创 动画函数封装
实现原理 一、匀速动画 1、实现步骤： 2、动画函数的封装 二、缓动效果 1、原理： 2、步骤： 3、使动画在多个目标值之间移动 案例：从500到800 再从800到500 4、动画函数添加回调函数 案例：到达500之后背景颜色由skyblue变成pink 总结 案例：滑动效果
2022-05-08 00:00:57
434
原创 mouseover和mouseenter的区别
mouseover：鼠标经过自身盒子会触发，经过子盒子还会触发 mouseenter：只会在鼠标经过自身盒子才会触发 跟 mouseleave 鼠标离开 搭配 原理：mouseenter与mouseleave不会冒泡，mouseover会冒泡 <head> <style> .father { width: 300px; height: 300px; background-color: pink;
2022-05-07 20:30:08
231
原创 案例分析。
淘宝flexible.js源码分析 1、立即执行函数 不需要调用，立马就能够自己执行 刷新页面触发load事件的三种情况 1、a标签的超链接 2、F5或者刷新按钮（强制刷新） 3、前进后退按钮 (function() {} ())
2022-05-05 23:05:56
228
原创 offset、client、scroll三大系列
一、元素偏移量offset系列 1、offset系列属性 2、offset与style的区别 案例：获取鼠标在盒子内的坐标（我们在盒子内移动，想要得到鼠标距离盒子左右的距离） 二、元素可视区client系列 1、client系列属性 三、元素滚动scroll系列 1、元素scroll系列属性 2、页面被卷去的头部 案例：仿淘宝固定右侧侧边栏 3、页面被卷去的头部兼容性解决方案 三大系列总结
2022-05-04 23:46:23
486
原创 模态框与产品放大镜效果
拖动模态框（弹出框） 案例分析： 点击弹出层，模块框和灰色半透明的遮挡层就会显示出来 display：block； 点击关闭按钮，模块框和灰色半透明的遮挡层就会隐藏出来 display：none； 鼠标放到模块框最上面一行，可以按住鼠标拖拽模块框在页面中移动，触发的事件源是最上面一行，即id为title 鼠标松开，可以停止拖动模态框移动 在页面中拖拽的原理：鼠标按下并且移动，之后松开鼠标 触发事件是鼠标按下mousedown、鼠标移动mousemove、鼠标松开mouseup 拖拽过程：鼠标
2022-05-04 23:46:00
129
原创 JS执行机制
JS执行机制 1.将执行任务分为同步任务和异步任务 2.先执行执行栈中的同步任务 3.异步任务（回调函数）放入任务队列中 4.一旦执行栈中的所有同步任务执行完毕，系统就会按次序读取任务队列中的异步任务，于是被读取的异步任务结束等待状态，进入执行栈，开始执行。 同步任务： 同步任务都在主线程上执行，形成一个执行栈 异步任务：JS的异步是通过回调函数实现的，一般有以下三种类型 普通事件，如click、resize等 资源加载，如load、error等 定时器，包括setInterval、s
2022-05-03 11:11:20
116
原创 this指向问题
一般情况下this的最终指向的是那个调用它的对象 1. 全局作用域或者普通函数中this指向全局对象window（ 注意定时器里面的this指向window） （1）全局作用域中 console.log(this); （2）普通函数中 function fn() { console.log(this); } window.fn(); （3）定时器中 window.setTimeout(function () { ...
2022-05-03 10:09:05
92
原创 BOM学习笔记
一、定义 二、window对象的常见事件 1、窗口加载事件 2、调整窗口大小事件 3、定时器 （1）开始setTimeout()定时器 （2）停止setTimeout定时器——clearTimeout() （3）setInterval()定时器 （4）停止setInterval()定时器 4、location对象 （1）location对象属性 （2）location对象方法 （3）URL 5、navigator对象 6、history对象
2022-05-01 23:22:34
632
原创 DOM的一些案例
1、百度换肤效果 2、表格隔行变色效果 3、表单全选和取消全选 4、tab栏切换制作 5、动态生成表格 6、跟随鼠标的天使 7、模拟京东按键输入内容案例
2022-04-21 20:39:29
233
原创 DOM学习笔记
定义一、获取元素1、根据ID获取2、根据标签名获取 3、H5新增方法获取——均是以伪数组的形式返回（1）根据类名获取某些元素的集合（2）返回指定选择器的第一个元素对象（3）返回指定选择器的所有元素对象集合4、获取某些特殊元素（body、html）二、事件1、定义2、事件三要素三、操作元素1、改变元素内容2、改变元素属性（1）获取属性值（2）改变元素属性值（3）移除元素属性值3、改变表单元素4、修改样式属性5、排他思想：首先先排除其他人 然后再设置自己的样式6、H5新增的自定义属性
2022-04-18 22:51:50
1265
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人