- 博客(83)
- 收藏
- 关注
原创 css自定义字体@font-face的使用方法
*声明一个名为iconfont的字体变量*/ src : url('../font/iconfont.eot');font-family属性:字体名称 自定义url属性:自定义字体在当前服务器的位置(可填相对路径和绝对路径)format属性:字体的格式 主要用于浏览器识别通常有以下几种:truetype opentype truetype-aat embedded-opentype avg等TrueType格式(.ttf)
2023-07-14 10:06:12 2263
原创 setTimeout的参数
参考链接示例:function timeout(ms) { return new Promise((resolve, reject) => { setTimeout(resolve, ms, 'done','123','333'); });}timeout(100).then((value,v1,v2) => { console.log(value,v1,v2);});结果是:done undefined undefined原因:Promise.r
2022-05-25 16:41:50 162
原创 获取固定长度的字符串
const getStrLen = (str,len) => { if(!str) return ''; var strlen = 0; if(str.length*2 <= len) return str; var s = ""; var tmp = ""; for (var i = 0; i < str.length; i++) { if (str.
2022-04-25 11:51:28 318
原创 设置某个div的内容全屏显示
<FullscreenOutlined onClick={()=>handleFull()}/>const handleFull=()=>{ var fullscreen = false; let fullarea = document.getElementById('container') if (fullscreen) { // 退出全屏 if (document.exitFullscreen) {
2022-04-25 11:45:04 533
原创 React 阻止冒泡失效
在react中可以用下面的阻止冒泡: e.stopPropagation(); e.nativeEvent.stopImmediatePropagation();e.nativeEvent 才是原生 DOM 事件的那个 eventReact组件类似onClick的事件是合成事件,本质上所有绑定是代理到document上的,所有绑定都会冒泡到document层去执行A、阻止合成事件间的冒泡,用e.stopPropagation();B、阻止合成事件与最外层document上的事件间的冒泡,用e
2021-07-27 11:12:37 890
原创 react-devtools的安装
完整的安装方法git clone https://github.com/facebook/react-devtools.gitcd react-devtools //切换到工程目录git checkout v3 // 切换到v3分支cnpm install // 安装依赖npm run build:extension:chrome //安装依赖成功后,打包一份扩展程序在浏览器上打开chrome://extensions/点击 “开发者模式”点击“加载已解压的扩展程序”选择 reac
2021-06-29 10:28:22 188
原创 stopPropagation与stopImmediatePropagation的区别
参考链接stopPropagationevent.stopPropagation();阻止事件冒泡。stopImmediatePropagationevent.stopImmediatePropagation(); 阻止事件冒泡并且阻止该元素上 同事件类型 的监听器被触发。对的所以除了上面的绑定方式,还可以直接:e.stopPropagation(); e.nativeEvent.stopImmediatePropagation();...
2021-06-25 11:03:36 115
原创 实现下载图片
下载事件: let eleLink = document.createElement("a"); eleLink.style.display = "none"; eleLink.href = qrData.qrcode + "&access_token=" + token + "&down_flag=1"; eleLink.download = this.event_id + ".png"; document.body.append
2021-06-17 15:12:24 123
原创 js实现鼠标拖拽多选功能示例
参考链接<textarea readonly="readonly" name="code" class="PHP"><!DOCTYPE html><html><head> <title>鼠标拖拽多选功能</title> <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script> <st
2021-05-18 15:34:23 320
原创 js 深拷贝和浅拷贝
参考链接浅拷贝的方法用Object.assign()深拷贝方法一:JSON.parse(JSON.stringify)方法二:采用递归的方法:
2021-05-13 15:38:27 81
原创 react ref的用法
ref的3种用法:在 React v16.3 之前,ref 通过字符串(string ref)或者回调函数(callback ref)的形式进行获取。ref 通过字符获取:// string refclass MyComponent extends React.Component { componentDidMount() { this.refs.myRef.focus(); } render() { return <input ref="myRef" />;
2021-04-22 10:17:17 281
原创 css超过几行显示省略号
1.超过一行省略:{ overflow: hidden; text-overflow: ellipsis; word-break: break-all;}2.超过2行的{ overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 数值代表显示几行 */ -webkit-box-orient: vertical; word-
2021-03-30 09:11:40 260
原创 div js+css 阻止点击穿透+实现点击穿透
参考链接:https://blog.csdn.net/weixin_36270908/article/details/100575779遇到的问题是:在做订阅号分享到微信显示水印的时候遇到的,因为水印是盖在最上层的,所以订阅号文章中的视频按钮点击就不生效了,也就是视频点击不会播放。这里解决方法就是给水印这层的div设置事件穿透,让点击透传到下层去。 用到了一个纯样式: pointer-events: none;...
2021-01-11 09:23:37 1807
原创 e.target和e.currentTarget区别
参考链接:https://www.cnblogs.com/lovemomo/p/10751389.html
2020-11-03 17:07:54 254
原创 momentjs的使用
参考:moment中文网https://www.cnblogs.com/MrZhujl/p/11398704.html使用获取当前时间moment()获取今天0时0分0秒moment().startOf('day)获取本周第一天(周日)0时0分0秒moment().startOf('week')获取当前月第一天)0时0分0秒moment().startOf('month')获取今天23时59分59秒moment().endOf('day')
2020-10-23 15:47:06 146
原创 word-wrap和word-break区别
word-wrap:break-wordword-wrap 属性用来标明是否允许浏览器在单词内进行断句会首先尝试挪到下一行,看看下一行的宽度够不够,不够的话就进行单词内的断句。word-break:break-all;word-break属性用来标明怎么样进行单词内的断句。它断句的方式非常粗暴,它不会尝试把长单词挪到下一行,而是直接进行单词内的断句。主要区别:word-wrap:break-word会首先起一个新行来放置长单词,新的行还是放不下这个长单词则会对长单词进行强制断句;而wo
2020-07-17 10:32:08 231
原创 js 构造函数
什么是构造函数1.在 JavaScript 中,用 new 关键字来调用的函数,称为构造函数。2.构造函数首字母大写(规范),通过new创建的是引用类型为什么要是用构造函数1.在使用对象字面量创建一系列同一类型的对象时,这些对象可能具有一些相似的特征(属性)和行为(方法),此时会产生很多重复的代码,而使用构造函数就可以实现代码的复用。构造函数的执行过程a、当以 new 关键字调用时,会创建一个新的内存空间,标记为 一个的实例b、 函数体内部的 this 指向该内存c、执行函数体内的代码d、
2020-06-12 14:54:13 439
原创 this,apply,call
this的指向重点:哪个对象调用函数,函数里面的this指向哪个对象。ES6 提供了箭头函数,增加了我们的开发效率,但是在箭头函数里面,没有 this ,箭头函数里面的 this 是继承外面的环境。call 和 apply 的作用,完全一样,唯一的区别就是在参数上面。call 接收的参数不固定,第一个参数是函数体内 this 的指向,第二个参数以下是依次传入的参数。apply接收两个参数,第一个参数也是函数体内 this 的指向。第二个参数是一个集合对象(数组或者类数组)参考链接:this
2020-06-07 14:13:16 108
原创 mac 安装sass
sass基于Ruby语言开发而成,因此安装sass前需要安装Ruby。mac是自带ruby的,在终端可以执行:ruby -v安装sass由于mac自带ruby,可以直接安装sassgem install sass如果出现不能permissions问题,一般是权限问题,可以尝试以下命令(使用管理员权限安装)sudo gem install sass回车之后输入密码回车即可(输入...
2020-01-21 11:50:49 1176
原创 配置ssh公钥访问git仓库
参考链接:https://coding.net/help/doc/account/ssh-key.html用户可以设置账户 SSH 公钥,获所有仓库的读写权限; 也可以在项目设置里面设置项目部署公钥,获取单个项目仓库的只读权限。添加公钥后,您就可以在项目的代码页面点击 SSH 切换到 SSH 协议的 clone 地址,类似这样:git@git.coding.net:wzw/leave-a-m...
2020-01-19 11:06:42 737
原创 终端控制台
参考链接:https://blog.csdn.net/nianbingsihan/article/details/80236348在cmd或者nodejs的客户端indows下的CMD窗口默认是采用非UTF-8编码的,有时候运行一些UTF-8编写的批处理文件在控制台中的输出就是乱码以下是几种常用的编码:936 GBK(一般情况下为默认编码)437 美国英语65001 utf-8要设置...
2020-01-09 11:35:02 137
原创 npm install的版本
1.npm install 版本号^^指明的版本范围,只要不修改 [major, minor, patch] 三元组中,最左侧的第一个非0位,都是可以的。也就是说,要确定 ^版本包含的范围,先要找到 最左侧的第一个非0位 ,只有在这一位右侧的变动,才被包含在这个 ^ 指定的范围内。举个:^1.2.3版本包括:>= 1.2.3 并且 < 2.0.0^0.2.3版本包括:>=...
2019-08-08 17:34:14 612
原创 gulpfile
TasksTask 可以通过 gulp 方式来执行。如果只运行 gulp 命令,则会执行所注册的名为 default 的 task,如果没有这个 task,那么 gulp 会报错。Gulp.src()匹配模式详解https://blog.csdn.net/wildye/article/details/80516847语法:gulp.src(globs[, options])...
2019-08-08 16:44:42 95
原创 npm --save和--save-dev区别
npm包管理器在安装包的时候,会有2种方式,一种是-save一种是–save-dev.1、npm install <=> npm i --save <=> -S --save-dev <=> -D npm run start <=> npm start // 对应"scripts"里的"start"命令备注:<...
2019-08-08 14:05:43 197
原创 浏览器缓存带来的前端项目更新问题及解决方法
参考链接:https://blog.csdn.net/feiyu_may/article/details/88376945
2019-08-05 14:21:09 1696
原创 移动端h5页面输入框被遮挡的问题
只有安卓才会出现这种情况:1.判断是否是安卓机的方法:2.解决方法:参考链接:https://www.cnblogs.com/dongcanliang/p/7383508.html
2019-06-04 15:19:32 2912
原创 css link和@import区别用法
参考链接:http://www.divcss5.com/rumen/r431.shtml两者都是引入css到html@import就相当于css样式,引入的时候有2中方法:1、直接在html中<style type="text/css">@import url(css文件路劲地址)</style>2直接在css中引用:@import url(cs...
2019-04-23 14:20:34 120
原创 ios中中textarea光标随页面动的问题的问题
为了解决ios中滚动卡顿的问题,一般会加下面的css样式:-webkit-overflow-scrolling: touch;但是加了会出现下面的情况:在textarea中聚焦之后,在很快滚动页面,textarea的光标会随页面上下移动,然后等页面停止之后才会在回到textarea中,这个是因为-webkit-overflow-scrolling: touch;使用具有回弹效果的滚动,当手...
2019-04-15 18:47:35 1119
原创 关于请求的数据很多的情况
关于调后端的接口,返回的数据量很大的情况,很难给出大概返回的数据(几兆)是多大的时候会出问题,应该关注的点是大概接口什么时候能返回数据,一般超过两三百毫秒用户就会觉得页面反应有点慢了,影像这个时间的因素有很多:服务器配置缓存设置使用(redis等等)数据库设计(又包括了索引的使用)数据量的大小(数据库的吞吐量)网络带宽因素等...
2019-04-11 15:49:09 645
原创 h5页面在不同iOS设备上的问题总结
参考链接:https://mp.weixin.qq.com/s/j5emRZ1QvwdoAvqBdEx-OQ
2019-04-10 09:56:44 246
原创 fastclick.js导致input和textarea聚焦难的问题
都是修改fastclick.js文件input的聚焦难的解决方法:参考链接:https://github.com/ftlabs/fastclick/issues/548textarea的问题参考链接:http://www.php.cn/js-tutorial-387360.html...
2019-04-08 10:03:00 833
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人