- 博客(66)
- 收藏
- 关注
RSS订阅原创 CSS页面效果设计常用选择器
####基础选择器选择器别名说明版本常用tag标签选择器指定类型的标签1√idID 选择器指定身份的标签1√class类选择器指定类名的标签1√*通配选择器所有类型的标签2√####层次选择器选择器别名说明版本常用elemP elemC后代选择器元素的后代元素1√elemP>elemC子代选择器元素的子代元素2√elem1+elem2相邻同胞选择器元素相邻的同
2021-06-03 11:20:28
214
原创 关于目前vue首屏加载耗时（包体积过大）问题的5点解决方案小记
路由组件懒加载 利用nginx和webpack来 Gzip 压缩与代码压缩（webpack.optimize.UglifyJsPlugin插件） 将依赖库挂到 CDN 上 组件按需引入，减少不必要的依赖 关闭SourceMap生成 路由组件懒加载const Article = () => import('@/components/Article')//本质上是利用了Promise启用 Gzip 压缩与代码压缩（webpack.opti...
2021-04-14 11:42:54
351
原创 vue用Object.defineProperty手写一个简单的双向绑定的示例
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>双向绑定</title></head><body> 手写一个简单双向绑定<br/> <input type="text" id="model"&...
2020-04-08 11:08:37
280
原创 时间格式化封装
更好的选择：JavaScript 日期处理类库 http://momentjs.cn/Date.prototype.Format = function (fmt) { var o = { "M+": this.getMonth() + 1, // 月份 "d+": this.getDate(), // 日 "h...
2019-09-17 10:18:02
154
原创 javascript一些使用技巧（ES6）
目录1，位运算，双位操作符2，Object[key]的妙用3，Array.find4，展开运算符 ...z5，模板字符串 ``6，默认参数值和强制参数7，箭头函数可以隐式返回值1，位运算，双位操作符Math.floor(4.9) === 4 //true/*-----------------------------------------------...
2019-06-25 17:18:02
232
转载 Javascript思维导图10张
目录导览javascript变量 javascript运算符 javascript数组 javascript流程语句 javascript字符串函数 javascript函数基础 javascript基础DOM操作 文档对象模型DOM BOM浏览器对象模型 javascript正则表达式javascript变量javascript运算符javascri...
2019-06-20 17:19:10
411
原创 javaScript遍历对象、数组总结
javaScript遍历对象总结1、使用Object.keys()遍历 返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性).var obj = {'0':'a','1':'b','2':'c'};Object.keys(obj).forEach(function(key){ console.log(key,obj[ke...
2019-01-30 18:00:54
340
原创 解决vuex在页面刷新后数据被清除相关解决方案
原由剖析： JavaScript代码是运行在内存当中的，代码运行时的变量，函数，也都是保存在内存中的。刷新页面后，之前申请的所有内存会被释放，重新加载JavaScript代码，变量和函数将重新赋值和初始化。因此，刷新页面保留数据就必须使用外部存储——客户端 or 服务器客户端存储：1，localStoragelocalStorage生命周期是永久，这意味着除非用户显示在浏览器...
2019-01-30 17:34:55
4449
3
原创 Vue路由跳转使用小记
canvue项目如何刷新当前页面（并干掉瞬间的空白页面）https://blog.csdn.net/qq_16772725/article/details/80467492路由跳转使用小记1，router.push(location) ===== window.history.pushState想要导航到不同的 URL，则使用router.push方法。这个方法会向 h...
2019-01-30 16:21:54
325
原创 Vue中的 watch 监听使用与计算属性 computed使用小记
观察 Vue 实例变化的一个表达式或计算属性函数 // a 单个属性的监听 // 'obj.a'字符串形式监听对象单个属性 // obj 对象监听，给对象的所有属性都加上监听器，性能开销会非常大 watch: { 'obj.a': { handler(newName, oldName) { console.log('新值-...
2019-01-30 15:26:59
325
原创 H5微信开发，开发起步，分享配置等归纳
<script src="js/pace.min.js"></script> <script src="js/require.js" data-main="js/main" defer async="true"></script> /*---------------------------
2019-01-22 16:54:29
311
转载 H5C3新增内容总结记忆
CSS3CSS3选择器有哪些？答：属性选择器、伪类选择器、伪元素选择器。CSS3新特性有哪些？答：1.颜色：新增RGBA，HSLA模式2. 文字阴影（text-shadow、）3. 边框： 圆角（border-radius）边框阴影： box-shadow4. 盒子模型：box-sizing5. 背景：background-size 设置背景图片的尺寸background-orig...
2019-01-22 16:30:00
230
转载 C3特性速查
1、浏览器私有前缀谷歌（苹果）：webkit火狐：-moz-欧朋：-o-IE：-ms-2、CSS3介绍CSS3是CSS2的“进化”版本优点：新增了一些特性，使得web开发变得高效便捷。缺点： 1、浏览器支持程度差，需要添加私有前缀2、移动端支持优于PC端3、不断改进中3、新增选择器属性选择器伪类选择器伪类目标：target伪类空...
2019-01-22 16:29:41
219
原创 canvas画图，toDataURL方法封装
URI（Uniform Resource Identifier）:统一资源标识符,服务器资源名被称为统一资源标识符 URL（Uniform Resource Locator）:统一资源定位符，描述了一台特定服务器上某资源的特定位置 function getBase64(url, callback) { //通过构造函数来创建的 img 实例，在赋予 src ...
2019-01-22 16:16:39
4300
1
转载 html页面使用canvas保存为图片
html2canvas 官方GitHub https://github.com/niklasvh/html2canvasCanvas2Image.js 第三方库 https://github.com/hongru/canvas2image 生成图片的清晰度取决于html转换成的canvas的清晰度：将canvas的属性width和height属性放大为2倍（或者设置为devic...
2019-01-16 17:27:02
1581
原创 数据的类型转换
显示转换—— 转数字 ——Number()如果转换的内容可以转成数字，那么就直接返回这个内容对应的数字 如果在内容中出现小数，那么小数会保留 如果是内容为空，那么转换成0 如果不可以转换那么返回NaNparseInt()如果转换的内容可以转成数字，那么就直接返回这个内容对应的数字 如果不可以转换那么返回NaN 如果带有小数，那么会去掉小数，转成整数（向下取整）pars...
2018-10-26 13:45:05
187
转载 JS制作实现一个图片懒加载插件
http://www.zyy1217.com/2017/03/20/js%E5%AE%9E%E7%8E%B0%E4%B8%80%E4%B8%AA%E5%9B%BE%E7%89%87%E6%87%92%E5%8A%A0%E8%BD%BD%E6%8F%92%E4%BB%B6/
2018-10-25 10:31:19
518
原创 解决行内块元素出现空白间隙
行内块元素之间出现的空白间隙，通常是由连续多个空白符（空格，换行符，回车符等）引起的。如何解决 display:inline-block; 行内块元素出现空白空隙问题？答案就是：给他的父元素加：font-size:0px;...
2018-10-24 10:40:29
3520
转载 如何让textarea placeholder 文字垂直居中？
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> #textArea { color: white;
2018-10-22 11:41:53
14631
原创 CSS 元素水平，垂直居中方法
一，行内元素：div{ text-align:center } /*DIV内的行内元素均会水平居中*/ div{ height:30px; line-height:30px } /*DIV内的行内元素均会垂直居中*/ 二，块级元素：div p{margin:0 auto; width:500px} /*块级元素p一定要设置宽度，才能...
2018-10-08 11:29:43
174
翻译 JQ常用方法汇总
目录1、寻找元素选择器筛选器2、属性操作基本属性操作CSS类HTML代码/文本/值 3、CSS操作样式 位置尺寸 4、文档处理 内部插入 外部插入替换删除复制5、事件页面载入页面处理页面委派事件(event object) 对象 6、效果 基本滑动淡入淡出 7、对象访问8、插件拓展...
2018-08-31 15:05:02
840
原创 常用字体对照表和常用命名
登录条: loginBar 标志: logo 侧栏: sideBar 广告: banner 导航: nav 子导航: subNav 菜单: menu 子菜单: subMenu 搜索: search 滚动: scroll 页面主体: main 内容: content 标...
2018-08-22 21:09:02
4822
翻译 目前9种跨域请求解决方案及详解
1，CORS（跨域资源共享）优点CORS 通信与同源的 AJAX 通信没有差别，代码完全一样，容易维护。 支持所有类型的 HTTP 请求。缺点存在兼容性问题，特别是 IE10 以下的浏览器。 第一次发送非简单请求时会多一次请求。2，JSONP 跨域优点使用简便，没有兼容性问题，目前最流行的一种跨域方法。缺点只支持 GET 请求。 由于是从其它域中加载代码执行，因...
2018-08-12 15:42:37
5082
转载 Ajax原理及使用方法(前端后台数据交互)
学习前端到一个阶段，必定会碰到一个不可避免的问题，即前端跟后端之间到底是怎么进行数据交互的?那么针对这个问题，我们来讨论一下以下三种方法：1、form表单2、ajax3、websocket（不讨论）首先，最原始的，通过form表单以post/get方式提交数据。当你点击submit按钮时，浏览器会默认把你在input里面输入的数据，以post或get的方式提交到form表单中的acti...
2018-08-10 17:54:08
30412
1
翻译 Ajax前端后台数据交互分析
纯粹的前端工程师已经不存在了，做前端开发必须要了解必要的后台、数据库知识，以及与后台的交互设计，其中你需要知道的名词包括 JSON、AJAX、序列化、推送、comet、SSE、WebSocketJSONjs对象var person = { name:'person', age:11}key和value间用冒号连接，不同的key-value键值对之间用逗号连接，最后一个v...
2018-08-10 17:50:13
5639
2
翻译 前端后台——4种数据交互方式
1.利用cookie对象 Cookie是服务器保存在客户端中的一小段数据信息。使用Cookie有一个前提，就是客户端浏览器允许使用Cookie并对此做出相应的设置。一般不赞成使用Cookie。2.利用session对象session对象表示特定会话session的用户数据。客户第一次访问支持session的JSP网页，服务器会创建一个session对象记录客户的信息。当客户访问同一网站...
2018-08-10 17:39:04
13913
1
翻译 H5总结
HTML5HTML5广义的概念: 代表着浏览器技术发展的阶段，是html5 css3和js（API）一套前端技术的组合。HTML5新定义了一堆语义化标签，更有利于搜索引擎或辅助设备理解HTML页面内容。在不支持HTML5新标签的浏览器里，会将这些新的标签解析成行内元素( inline )对待，所以我们只需要将其转换成块元素( block )即可使用。低版本采用条件注释。表单：...
2018-08-09 21:05:36
938
翻译 CSS3特性总结
1.文本阴影text-shadowtext-shadow:偏移量x 偏移量y 模糊度 颜色；注意：水平偏移量： 正值向右，负值向左垂直偏移量： 正值向下，负值向上模糊度不能为负数可设置多个text-shadow，每个用逗号分隔例子:text-shadow:1px 2px 3px red,2px 3px 4px pink;2.边框圆角 border-...
2018-08-09 20:22:44
203
原创 Vue框架下，Axios用post提交的4种数据格式
application/x-www-form-urlencoded multipart/form-data application/json text/xml 具体信息可参考此博文：https://blog.csdn.net/wopelo/article/details/78783442
2018-08-09 14:49:32
6549
1
转载 ES6十大特性
ES6（ECMAScript2015）的出现，无疑给前端开发人员带来了新的惊喜，它包含了一些很棒的新特性，可以更加方便的实现很多复杂的操作，提高开发人员的效率。 本文主要针对ES6做一个简要介绍。 主要译自： http://webapplog.com/ES6/comment-page-1/。也许你还不知道ES6是什么, 实际上, 它是一种新的javascript规范。在这个大家都很忙碌的时代...
2018-08-06 10:13:25
129
原创 ES6中const var let区别
var 定义的变量可以修改，如果不初始化会输出 undefined，不会报错。const 定义的变量不可以修改，而且必须初始化let 是块级作用域，函数内部使用 let 定义后，对函数外部无影响。...
2018-08-02 17:41:44
120
原创 z-index叠加法则解析以及无效的3种情况
z-index无效三种情况 父标签 position 属性为 relative； 问题标签无 position 属性（不包括 static）； 问题标签含有浮动( float )属性。position:relative 改为 position:absolute； 浮动元素添加 position 属性（如 relative，absolute 等）； 去除浮动。z-in...
2018-07-29 12:57:55
632
转载 Css 详细解读定位属性 position 以及参数
position 以及参数总结position: relative;不会脱离文档流，position: fixed; position: absolute; 会脱离文档流 position: relative; 相对于自己在文档流中的初始位置偏移定位。 position: fixed; 相对于浏览器窗口定位。 position: absolute; 是相对于父级非 position:st...
2018-07-29 00:30:56
276
原创 冒泡排序数组以及按位异或(^)——看程序员认知
// for循环冒泡排序数组优化后 var arr = [10, 50, 70, 90, 20, 30]; for (var i = 0; i < arr.length - 1; i++) { var isOk = true; for (var j = 0; j < arr.length - 1 - i; j++) { ...
2018-07-27 19:14:11
977
原创 sublime秘钥
— BEGIN LICENSE —–ZYNGA INC.50 User LicenseEA7E-811825927BA117 84C9300F 4A0CCBC4 34A56B44985E4562 59F2B63B CCCFF92F 0E646B830FD6487D 1507AE29 9CC4F9F5 0A6F32E30343D868 C18E2CD5 27641A71 2547564...
2018-07-22 04:19:34
1670
1
原创 正则表达式
正则表达式MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Regular_Expressions史上最全的正则表达式 https://blog.csdn.net/qq_28633249/article/details/77686976匹配中英文、字母和数字 https://www.cnblog...
2018-07-13 22:18:41
589
原创 浅拷贝与深拷贝以及递归查询DOM树
浅拷贝：只拷贝当前对象的属性和方法，如果属性和方法是引用类型则只拷贝地址，所以会指向同一块内存空间，不完全独立。深拷贝：连同结构一起拷贝，完全独立。 // 浅拷贝 function copy(obj1, obj2) { for (var key in obj2) { obj1[key] = obj2[key]; ...
2018-07-08 16:19:10
217
原创 JS中的3大数据类型
基本类型：数字(Number)，布尔(Boolean)，字符串(String)复合类型：对象（Object，时间Date，正则表达式RegExp等），函数(Function)，数组Array空类型：Undefined Null...
2018-07-06 18:27:05
363
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人