前端小tip随笔记
文章平均质量分 93
一只自由的程序媛
凡心所向,素履所往
展开
-
记一次DNS解析js失败而阻塞渲染的问题及解决方案
事情的起因在渲染某页面时, 引入了一个地图插件的js, 由于这个js在加载时会出现加载失败的情况, 加载失败时就会阻塞整个页面的渲染从而导致页面空白原因分析 - 什么情况会出现加载js失败不是完全能复现, 排查下来发现只有chrome有这个问题而且chrome在连接浏览器代理时不会出现加载失败的情况在连接公司vpn的情况下不会出现加载失败的情况北京同事连公司内网也不会出现这个问题整体看下来只有在使用chrome直接连接公司上海的有线, 不走浏览器代理, 就会精准复现为什么会出现这种情况原创 2021-07-16 17:05:57 · 1066 阅读 · 1 评论 -
CSS技巧性实现多边形及各种条纹渐变图形
在页面构建中,能明显提升页面显示质量的一些CSS小技巧。很多简洁美观的页面表现,可以使用CSS3代码即可实现,减少图片的使用。 一、边框内圆角我们在设计例如按钮等控件的时候,会遇到这样的设计:只有内侧有圆角,而边框或者描边的四个角还是保持直角的形状,用以下代码可以轻松的实现。 #wrapper { width: 200px; height: 80px; ...转载 2018-07-23 22:32:11 · 2587 阅读 · 0 评论 -
常见正则表达式总结
1. 校验基本日期格式var reg1 = /^\d{4}(\-|\/|\.)\d{1,2}\1\d{1,2}$/;var reg2 = /^(^(\d{4}|\d{2})(\-|\/|\.)\d{1,2}\3\d{1,2}$)|(^\d{4}年\d{1,2}月\d{1,2}日$)$/;2. 校验密码强度密码的强度必须是包含大小写字母和数字的组合,不能使用特殊字符,长度在8-10之...转载 2018-07-23 22:35:06 · 177 阅读 · 0 评论 -
better-scroll插件的介绍及使用
在我们日常的移动端项目开发中,处理滚动列表是再常见不过的需求了,可以是竖向滚动的列表,也可以是横向的,用better-scroll可以帮助我们实现这个什么是 better-scroll better-scroll 是一个移动端滚动的解决方案,它是基于 iscroll 的重写,它和 iscroll 的主要区别在这里。better-scroll 也很强大,不仅可以做普通的滚动列表,...转载 2018-08-26 20:51:49 · 56607 阅读 · 2 评论 -
JS常见的DOM操作API
目录 几种对象NodeNodeListHTMLCollection节点查找API节点创建APIcreateElementcreateTextNodecloneNodecreateDocumentFragment节点修改APIappendChildinsertBeforeremoveChildreplaceChild节点关系API...转载 2018-08-29 16:41:57 · 196 阅读 · 0 评论 -
《奇舞团特训营》课程笔记(一)——响应式设计常见方法总结
viewport<meta name='viewport' content='width=device-width' initial-scale=1.0' >不建议设置禁止用户缩放:user-scalable:no图片展示大图随容器自动缩放,保持固定高宽比max-width:100%背景图片//背景图片background-size:cover;//用...原创 2018-11-28 11:03:16 · 414 阅读 · 0 评论 -
工作踩坑之面包屑tab栏箭头样式问题
好久没更新博客了,算来算去正式入职也有23天了,工作开始步入正轨,以后会定期更新最近学习的知识和工作中踩坑的小点。今天先来说一下,tab栏箭头样式问题在nav-btn中增加一个用来旋转的方块div,用下面代码实现.rotatebox{height:42px;width:43px;position: absolute;top: 8px;left: 138px;t...原创 2019-08-02 15:13:10 · 824 阅读 · 0 评论