随笔分类 - javascript
摘要：utils - water-mark - 水印 预览 blog git demo 介绍 水印 效果 使用 let waterMark = new WaterMark({ pushDom: false, }); waterMark.setImg( 'https://images.cnblogs.com
阅读全文
摘要：utils - 浏览器搜索 ctrl + f 模拟 插件 Cool Javascript Find On This Page... /* Cool Javascript Find on this Page Ver 5.3 Written by Jeff Baker on September, 8,
阅读全文
摘要：js - 防抖与节流 在进行窗口的resize、scroll，输入框内容校验等操作时，如果事件处理函数调用的频率无限制，会加重浏览器的负担，导致用户体验非常糟糕。此时我们可以采用debounce（防抖）和throttle（节流）的方式来减少调用频率，同时又不影响实际效果。 函数防抖（debounce
阅读全文
摘要：tools - 复制功能 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <ti
阅读全文
摘要：正则 常见规则 匹配中文字符的正则表达式： [\u4e00-\u9fa5] 匹配双字节字符(包括汉字在内)： [^x00-xff] 匹配中文，英文字母和数字及_： ^[\u4e00-\u9fa5_a-zA-Z0-9]+$ validate.js const rules = { eg: { reg:
阅读全文
摘要：前端面试题 - webAPI 元素操作 JS动态创建节点 请补全JavaScript函数，根据参数数组创建li元素。 要求： li元素的个数和数组的长度一样 li元素的内容是数组中的每个元素 将创建的所有li元素插入到ul中 // innerHTML function createLi(array)
阅读全文
摘要：前端面试题 - js - es5 数据类型 基本数据类型检测 请补全JavaScript函数，要求以字符串的形式返回参数的类型。 注意：只需检测基本数据类型。 function _typeof(value) { // 补全代码 let str = Object.prototype.toString.
阅读全文
摘要：js - 数据类型检测方法 通用但很繁琐的方法：prototype function dataType(val) { return Object.prototype.toString.call(val).slice(8,-1) } alert(Object.prototype.toString.ca
阅读全文
摘要：注释标记 参考 vscode 插件推荐 todo-tree Xcode中使用TODO、FIXME、!!!、???、MARK 进行标记 注释标记 TODO： 标示处有功能代码待编写，使用方法：// TODO: FIXME：标示处代码需要修正，使用方法：// FIXME: !!!：标示处代码需要注意，使
阅读全文
摘要：js - js运行机制 事件循环 宏任务和微任务 参考链接 简书 掘金 举个栗子 console.log('start') setTimeout(() => { console.log('setTimeout') }, 0) new Promise((resolve) => { console.lo
阅读全文
摘要：html-cookie what “cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。” - w3school 从JavaScript的角度看，cookie 就是一些
阅读全文
摘要：js-位运算符 w3school 位运算 位运算就是对二进制数执行计算，是整数的逐位运算。例如，1+1=2，在十进制计算中是正确的，但是在二进制计算中，1+1=10；对于二进制数 100 取反，等于 001，而不是 -100。 位运算符 位运算符有 7 个，分为两类： 逻辑位运算符 位与（&）、位或
阅读全文
摘要：js - 大文件上传下载 大文件上传-分片上传 分片上传的好处是将一个大请求分成多个小请求来执行，这样当其中一些请求失败后，不需要重新上传整个文件，而只需要上传失败的分片就可以了。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-
阅读全文
摘要：github.io <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>js add js
阅读全文
摘要：使用js去除字符串内所带有空格，有以下三种方法： ( 1 ) replace正则匹配方法 去除字符串内所有的空格：str = str.replace(/\s*/g,""); 去除字符串内两头的空格：str = str.replace(/^\s*|\s*$/g,""); 去除字符串内左侧的空格：str
阅读全文
摘要：js下载文件流，提示文件损坏问题 前端axios,也需要加responseType: “blob”,这样才能正常下载文件流。 eg: axios({ url: layui.setter.apiHost + '/api/order/putAllPages', method: "POST", heade
阅读全文
摘要：页面跳转 window.parent.location.reload() 让打开这个窗口的父窗口刷新，然后本子窗口关闭！ javascript:history.back() 就是后退啊!和浏览器里面的后退按钮一样！javascript:history.back(-1)就是后退一页 window.lo
阅读全文
摘要：优化高度限制 预览 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta
阅读全文
摘要：1.原生JS实现图片懒加载（考虑不重复加载以及节流） 知识点：视口位置判断，懒加载实现（data-set），节流等 1.Element.getBoundingClientRect() 该方法返回元素的大小及其相对于视口的位置, 具体解释及用法参考 MDN. 通过 Element.getBoundin
阅读全文
