![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
H5html
资深CV大师
这个作者很懒,什么都没留下…
展开
-
移动端开发调试工具
1、抓包工具Charles、Fiddler平时只用抓取各种网络,需要设置手机的wifi代理推荐指数2颗星2、vConsole、eruda等调试库这个方法需要在页面中插入一段 JS 脚本,这里以vConsole为例,导入vconsole.min.js,并实例化,注实例化代码最好放在头部,以便能一开始就能劫持内容:<script src="./vconsole.min.js"></script> <script> // 初始化 new原创 2022-01-27 13:25:44 · 5369 阅读 · 3 评论 -
修改滚动条样式
/* --- 改变滚动条样式 --- */.scroll-area::-webkit-scrollbar { width: 10px;}/* --- 滚动条里面的滚动块 --- */.scroll-area::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 5px #eee; background: #eee;}/* --- 滚动条里面轨道 --- */.scroll-area原创 2021-03-18 15:53:40 · 167 阅读 · 0 评论 -
background-clip让padding不显示背景border和content隔开
<div></div>div{ height: 500px; width: 500px; border: 3px dashed #000; padding: 40px; background: red; background-clip: content-box;}原创 2021-01-07 15:46:19 · 536 阅读 · 0 评论 -
HTML识别js插值赋值 string 变量里的 ‘\n‘ 并成功换行显
例如vue中需要换行的变量<div style="white-space: pre-line;">{{title}}</div>this.title = '这是一个/n长字符串'在结果所在的 div 的 css 设置:white-space: pre-line;然后页面就能成功识别 ‘\n’ ,并换行显示这是一个长字符串...原创 2020-12-30 14:38:43 · 615 阅读 · 0 评论 -
gitlab配置ssh密钥
1.打开本地git bash,使用如下命令生成ssh公钥和私钥对ssh-keygen -t rsa -C 'xxx@xxx.com' 然后一路回车(-C 参数是你的邮箱地址)2.然后会出现:Enter file in which to save the key (/Users/yzq/.ssh/id_rsa):回车3.如果你的.ssh/id_rsa已经,则会出现:/Users/yzq/.ssh/id_rsa already exists.Overwrite (y/n)? y输入:y (重新原创 2020-07-20 20:58:29 · 4873 阅读 · 1 评论 -
常用正则表达式
大于0或者大于0保留2位小数的正数:/^(([1-9][0-9])|(([0].\d{1,2}|[1-9][0-9].\d{1,2})))KaTeX parse error: Undefined control sequence: \d at position 19: …于0的正整数:/(^[1-9]\̲d̲*)/1-9.99折扣:/^(?=1.[1-9]|[1-9].\d).{3}∣([2−9])|^([2-9])∣([2−9])/...原创 2020-06-15 11:08:52 · 550 阅读 · 0 评论 -
js原生ajax最简封装
function myAjax (url, callback) { var xhr = new XMLHttpRequest(); xhr.open('get', url); xhr.send(); xhr.onreadystatechange = function () { if (request.readyState === 4) { if (request.status === 200) { return c原创 2020-06-12 11:31:32 · 228 阅读 · 0 评论 -
彻底弄懂强缓存与协商缓存
在工作中,前端代码打包之后的生成的静态资源就要发布到静态服务器上,这时候就要做对这些静态资源做一些运维配置,其中,gzip和设置缓存是必不可少的。这两项是最直接影响到网站性能和用户体验的。缓存的优点:减少了不必要的数据传输,节省带宽减少服务器的负担,提升网站性能加快了客户端加载网页的速度用户体验友好缺点:资源如果有更改但是客户端不及时更新会造成用户获取信息滞后,如果老版本有bug的话,情况会更加糟糕。所以,为了避免设置缓存错误,掌握缓存的原理对于我们工作中去更加合理的配置缓存是非常重要的。原创 2020-06-11 12:59:36 · 857 阅读 · 0 评论 -
javascript用户密码加密,js密码加密base64加密md5加密sha1加密
1、base64加密在页面中引入base64.js文件,调用方法为:<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>base64加密</title><script type="text/javascript" src="base64.js"></script><script type="text/javascript">原创 2020-06-10 11:40:12 · 161 阅读 · 0 评论 -
原生JavaScript封装Ajax同步异步封装
// 封装ajax函数// @param {string}opt.type http连接的方式,包括POST和GET两种方式// @param {string}opt.url 发送请求的url// @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的// @param {object}opt.data 发送的参数,格式为对象类型// @param {function}opt.success ajax发送并接收成功调用的回调函数 funct原创 2020-06-06 12:04:09 · 556 阅读 · 1 评论 -
ajax跨域,这应该是最全的解决方案了
题纲———————————————————————————————————关于跨域,有N种类型,本文只专注于ajax请求跨域(,ajax跨域只是属于浏览器"同源策略"中的一部分,其它的还有Cookie跨域iframe跨域,LocalStorage跨域等这里不做介绍),内容大概如下:什么是ajax跨域原理表现(整理了一些遇到的问题以及解决方案)如何解决ajax跨域JSONP方式CORS方式代理请求方式如何分析ajax跨域http抓包的分析一些示例什么是ajax跨域ajax出现请求跨原创 2020-05-21 14:32:03 · 135 阅读 · 0 评论 -
原生js将字符串转换成条形码JsBarcode.js
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <style>原创 2020-05-21 14:09:57 · 1215 阅读 · 0 评论 -
原生js将字符串转换成二维码qrcode.js
二维码生成原创 2020-05-21 14:08:34 · 1566 阅读 · 4 评论 -
获取近期N天的时间戳和时间
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script type="text/javascript"> //当天 var Date8 = new Date(); //前一天 var Date7 = ne原创 2020-05-21 14:07:34 · 280 阅读 · 0 评论 -
最简单的原生js选项卡功能
<!DOCTYPE html><html> <head> <title>tab选项卡</title> <meta charset="utf-8"> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <style type="text/css"> li { list-st原创 2020-05-21 14:07:00 · 186 阅读 · 0 评论 -
echarts 调整canvas内部里面图表与外框大小比例的方法
myChart.setOption({ option: { title: { text: 'ECharts 入门示例' }, //设置canvas内部表格的内距 grid:{ x:50, y:50, x2:50, y2:60, borderWidth原创 2020-05-20 15:40:11 · 2046 阅读 · 0 评论 -
webpack url-loader limit 转换部分资源为base64格式 其余不转换
在Vue-cli中,我们默认使用webpack将所有的小于限制数值的资源转为base64格式:如下:{test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,loader: ’url-loader’,options: {limit: 10,}},/limit: 10,限制 图片大小 10B,小于限制会将图片转换为 base64格式/这样做的好处是:将资源转化为base64可以尽可能的减少网络请求次数、提前加载图片(网络不好时候提前显示图片),但是也有很大的缺点,这也是原创 2020-05-17 20:27:59 · 1569 阅读 · 0 评论 -
H5,vue,react通用,富文本框组件,图片上传以及渲染页面
H5,vue,react富文本框组件,图片上传以及渲染页面,下面代码是大概逻辑是把富文本框里面的所有文字以及图片处理成字符串形式提交到业务接口,然后在对应页面可以做渲染。如果要做视频处理成字符跟下面图片处理方式是一致的。Quill官方中文文档<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link href="https原创 2020-05-14 16:14:37 · 602 阅读 · 0 评论 -
文件上传
一、调用FileReader对象的方法方法名 参数 描述abort none 中断读取readAsBinaryString file 将文件读取为二进制码readAsDataURL file 将文件读取为 DataURLreadAsText file, [encoding] 将文件读取为文本readAsText:该方法有两个参数,其中第二个参数是文本的编码方式,默认值为 UTF-8。这...原创 2020-05-08 10:41:32 · 300 阅读 · 0 评论 -
js a标签的各种妙用
1. 拨打电话代码如下所示:<a href="tel:1*********">拨号</a>字符串拼接方法成功代码如下所示:<a :href="'tel:' + telPhone">{{telPhone}}</a>若不好使,再试试在html文件中头部加入代码,移动web页面自动探测电话号码<meta name="format-d...原创 2020-04-27 17:56:23 · 676 阅读 · 0 评论 -
js时间工具函数
在线秒表工具:http://tools.jb51.net/bianmin/miaobiao在线日期/天数计算器:http://tools.jb51.net/jisuanqi/date_jisuanqi在线日期计算器/相差天数计算器:http://tools.jb51.net/jisuanqi/datecalcUnix时间戳(timestamp)转换工具:http://tools.jb...原创 2020-04-20 09:56:24 · 203 阅读 · 0 评论 -
【JQ】jquery原生js JavaScript获取input type="file" 选择的文件大小、文件名称、上次修改时间、类型等信息
文件名的传递 —全路径获取$('#file').change(function(){ $('#em').text($('#file').val());});文件名的传递 —只获取文件名var file = $('#file'), aim = $('#em'); file.on('change', function( e ){ //e.current...原创 2020-04-14 17:30:16 · 930 阅读 · 0 评论 -
element-ui trr树形结构点击当前背景再点击其它地方会消失问题解决,以及修改当前背景色。
点击其它地方当前背景色消失解决 <el-tree :data="menuData" node-key="id" :highlight-current="showTree" <!--高亮显示 不让背景消失--> @node-click="getNode...原创 2020-04-14 15:42:44 · 2239 阅读 · 0 评论 -
hbuilderX 移动网页如何在手机查看,扫码预览打不开
解决方法1.打开控制cmd,输入ipconfig /renew 查看ipv4的地址复制下来2.然后打开hbuilderX的浏览器,把里面的ip地址替换为刚刚查找到的ipv4的地址,把这个新的地址发给手机,手机和电脑同一个wifi,这样就可以打开了...原创 2020-04-07 17:00:00 · 7522 阅读 · 5 评论 -
Js,各个UI库美化的alert弹框中文出现乱码问题解决
总结解决方法:1、指定Html文档编码:<meta http-equiv="Content-Type" content="text/html;charset=gb2312" /> 2、引入Js文件的时候指定编码:<script charset="gb2312" language="javascript" type="text/javascript" src="ntkoo...原创 2020-04-07 16:56:48 · 133 阅读 · 0 评论 -
JS-在本页面监听是否用户是点击了返回进入的(IOS返回页面时,页面未初始化)
之所以需要这个问题,是因为我再原生APP嵌套H5中,页面返回进入H5页面时,页面未初始化,再IOS系统中。这样的话页面会出现一些相应的BUG,所以,我想到的最简单的解决办法就是监听页面的返回事件。刷新页面window.onpageshow=function(e){ if(e.persisted) { window.location.reload() }};...原创 2020-04-01 22:26:09 · 292 阅读 · 0 评论 -
js监听手机返回按键操作,禁用返回按键操作。
**使用到的技术要点:**history.pushState()原理暂不做解释,后续再做补充,可参考popstate官方文档1、禁用手机返回按键,引入直接可用,亲测. XBack = {}; (function(XBack) { XBack.STATE = 'x - back'; XBack.element; XBack.onPopState = function(ev...原创 2020-04-01 22:23:37 · 988 阅读 · 3 评论 -
vue-cli3安装之桥接cli2
1.安装Vue cli3Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。如果你已经全局安装了旧版本的 vue-cli(1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。Vue cli3 对Node 版本要求的要求需要 Node.js 8.9 或更高版本 (推荐 8.11...原创 2020-03-30 22:01:09 · 262 阅读 · 0 评论