js常见用法 1、String扩展实例方法:includes(), startsWith(), endsWith()传统上,JavaScript 只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。includes():返回布尔值,表示是否找到了参数字符串。startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。let s = 'Hello world!';s.start
不同尺寸进行适配 1、适应不同分辨率平板: 2176 * 1600一体机:1920 * 10802、默认平板css3、入口文件上面添加4、XX.css 采用媒体文件@media only screen and (min-width:1920px) and (max-device-width: 1930px){}
js图片压缩 js图片压缩实现原理具体实现实现原理1、通过canvas进行处理2、图片宽高等比缩放,当前缩放比例为0.53、图片质量压缩,当前质量为0.94、得到新的base64位图片,转换为Blob的文件流具体实现/** * * 图片等比压缩 * @param {*} file 原文件流 * @param {*} M 超过几M进行压缩,默认超过1M才进行等比压缩 * @param {*} Fn 回调方法 */function compressImg(file,Fn,M=1){ if
svg图标 目前采用了目前比较流行的阿里巴巴矢量图标库中的svg图标普通用法1、具体操作:下载—复制SVG代码2、新建一个svg后缀的文件3、处理细节去掉不必要的属性,需保留以下属性// 一般保留宽高属性,若需自定义去除即可;若需要有颜色区别,还需保留颜色color属性;<svg width="128" height="128" xmlns="http://XXX"><path d="XXXX"/></svg>4、在使用的地方加上以下代码,期中test就是svg图
简易富文本编辑器 简易富文本编辑器textbus下载依赖包引入相关代码wangeditor引入依赖包引入基础代码菜单栏和内容区分离上传图片带标题预览以下都是vue项目,若是需要比较复杂的功能,比较推荐使用textbus;若是类似今日头条,偏简约风格,比较推荐使用wangeditor轻量级;textbus功能多,可自定义按钮,自定义插件,各种功能齐全,但是操作比较复杂,相关地址,如下下载依赖包npm install @textbus/textbus引入相关代码以下为基本方法template<templ
滑块验证码 1、原生代码原理快速拖动到尾部,相应滑块也跟着变动;拖拽时未到底部,滑块自动收缩至初始位置;兼容性支持移动端、PC端;html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>滑动</title> <link rel="stylesheet" href="css/drag.css" > <script src
js正则表达式收藏 js正则特殊正则密码1、同时存在大小写、数字,长度大于六位2、同时存在大小写、数字,或者包含特殊字符(._~!@#$^&*),禁止空格,长度大于六位特殊正则密码1、同时存在大小写、数字,长度大于六位/^(?=.\d)(?=.[a-z])(?=.*[A-Z])[a-zA-Z\d]{7,100}$/2、同时存在大小写、数字,或者包含特殊字符(._~!@#$^&*),禁止空格,长度大于六位/^(?!.\s)(?=.\d)(?=.[a-z])(?=.[A-Z])[a-zA-Z\d |a-
redis入门(linux) 下载架包路径:/opt/module/一、redis安装路径:cp redis.conf /usr/local/redis/etc注:将 redis.conf 复制到/usr/local/redis/etc路径下mv mkreleasehdr.sh redis-benchmark redis-check-aof redis-check-rdb redis-cli redis-server /usr/local/redis/bin注:将文件 复制到/usr/local/redis/bin路径下
sql优化 1、应尽量避免在 where 子句中使用!=或<>操作符,否则将引擎放弃使用索引而进行全表扫描。2、最左前缀匹配原则。mysql会一直向右匹配直到遇到范围查询(>、<、between、like)就停止匹配。所以要尽量把“=”条件放在前面,把这些条件放在最后。3、当取出的数据超过全表数据的20%时,不会使用索引。4、尽量将or 转换为 union all。5、很多时候用 exists 代替 in 是一个好的选择。 用not exists代替not in。6、不要写一些没有意
this与作用域的理论及应用 一、this关键字面向对象语言中 this 表示当前对象的一个引用。但在 JavaScript 中 this 不是固定不变的,它会随着执行环境的改变而改变。重点:谁调用这个函数或方法,this关键字就指向谁。• 在方法中,this 表示该方法所属的对象。• 如果单独使用,this 表示全局对象。• 在函数中,this 表示全局对象。• 在函数中,在严格模式下,this 上是未定义的(undefined)。• 在事件中,this 表示接收事件的元素。• 类似 call() 和 apply()
发布npm包 一、html+CSS1、标题元素h1~h62、段落元素没有任何语义、仅作为设置样式使⽤p、span元素3、pre元素预格式化⽂本元素,字符画元素空⽩折叠源代码中连续的空⽩字符(空格、换⾏、制表(tab缩进))会被折叠成⼀个空格4、a标签超链接、锚点(比如目录)5、路径根据资源的类型判断,⼀般站外资源⽤绝对路径,站内资源⽤相对路径绝对路径:书写格式协议名://主机名:端⼝名/路径https://www.baidu.com/中⽂会被编码成Unicode格式file://