![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
文章平均质量分 68
本心_
行动派
展开
-
监控鼠标滚动动画
需求之前在工作中遇到的需求。色块里面放了具体内容,有文字或文字加图片。要求并排的3个色块在鼠标往下滚动的过程中慢慢从下往上浮现,当滚动到一定距离后,色块内容更改,新的并排色块重新从下往上浮现,脱离动效后如果屏幕向上滚动,色块以相反效果展示。具体效果如下GIF所示,黑色部分是页面外的调试界面。问题分析上面的需求已经做了一层分析,将UI的想法抽象出来,用程序员的语言描述一遍,但这层分析还远远还不够。DOM结构设计难点在于整个动效DOM的结构设计。首先我们需要理解,页面在向下滚动的过程中,高度会不断原创 2022-02-07 01:01:37 · 900 阅读 · 0 评论 -
JavaScript 常用字符串方法
目录大小写转换将字符转换成ascll码十进制,以及从acsll码十进制转换成字符对象动态添加属性查找数组中是否存在某元素将字符串转为数组将数组转为字符串1.大小写转换let test = (str) => { // 字符串转换成大写方法 let up = str.toUpperCase(); // 字符串转换成小写方法 let lower = str.toLowerCase(); console.log(up); // .原创 2020-08-21 09:05:00 · 84 阅读 · 0 评论 -
Javascript 通用函数
虽然是通用函数,但可能并不常用,或者有很多替代方案,以此记录致敬《JavaScript Dom编程艺术》一书1.addLoadEvent(func)以上方法相当于一个容器,存放页面加载完成后需要执行的方法,只需将需要执行的方法的方法名作为参数调用此方法即可function addLoadEvent(func) { let oldonload = window.onload; if (typeof window.onload != 'function') { window.onl原创 2021-05-07 00:20:15 · 217 阅读 · 0 评论 -
JavaScript 获取url参数及解决中文乱码问题
1.获取url参数方法一: // 获取url参数 function getQueryVariable(variable) { var query = window.location.search.substring(1); var vars = query.split("&"); for (var i = 0; i < vars.length; i++) { var pair = vars[i].split("=");原创 2021-04-30 10:08:06 · 1506 阅读 · 0 评论 -
JQuery Ajax更新dom后点击方法失效问题
背景:本人在dom加载完成后,执行一个Ajax请求页面的导航栏标题,数据请求往后通过操作dom更新到页面上,并写好了绑定该元素的点击方法,但是发现点击方法无效$(element).click(function() { do something...})分析原因:Ajax请求是在dom首次加载完成后执行,然后再动态更新到dom,而上面对元素绑定的点击方法,是在dom首次加载完成后进行绑定,此时Ajax请求可能刚发出,当dom重新加载完成后,此时click事件不会重新绑定,即click事件绑原创 2021-04-19 10:03:56 · 703 阅读 · 1 评论 -
前端面试题
这些都是血淋淋的教训希望大家引以为戒1.em,rem,px的区别,为什么要设置这么多长度单位?https://cloud.tencent.com/developer/article/1538359https://segmentfault.com/a/11900000075269172.restful架构是什么?restful API 设计规范?http://www.ruanyifeng.com/blog/2011/09/restful.htmlhttp://www.ruanyi.原创 2021-04-01 20:55:25 · 165 阅读 · 1 评论 -
JS阻止事件冒泡event.stopPropagation与阻止默认事件event.preventDefault
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l.原创 2021-03-31 21:39:32 · 309 阅读 · 0 评论 -
ES6新增的部分语法
1.let和constlet和const的出现是为了弥补var,其中let是声明变量,const是声明常量,这两个变量主要解决了以下两个问题(1)变量提升var变量会发生‘变量提升’现象,即变量在声明之前使用,值为undefinedconsole.log('testVar:', testVar) // testVar: undefinedvar testVar = 17console.log('testLet', testLet) // 报错ReferencEerrorlet te原创 2021-03-16 15:28:37 · 237 阅读 · 0 评论 -
JS 常用对象方法总结
1.Object.create()新建一个对象,将原对象作为新对象的原型对象,新对象继承原对象的属性和方法2.Object.assign()3.Object.is()4.Object.getOwnPropertyDescriptors()遍历对象属性相关方法5.Object.keys()6.Object.getOwnPropertyNames()7.Object.getOwnPropertySymbols()8.Object.ownKeys()9.Obje..原创 2021-03-11 02:10:51 · 1653 阅读 · 0 评论 -
JS 常用数组方法总结
以下数组方法接收一个回调方法(callback)作为第一个参数,给回调方法传入的第一个参数为数组元素forEach:遍历每个元素,没有返回值map:遍历所有元素,对每个元素进行处理(callback),返回处理后的新数组,原数组不变find:找出第一个符合条件的成员,返回该成员findIndex: 找出第一个符合条件的成员,返回该成员的下标some:若数组中存在一个符合条件的成员,返回true,否则返回falseevery:若数组中所有成员都满足条件,返回true,否则返回false原创 2021-03-08 02:10:39 · 345 阅读 · 4 评论