随笔分类 -  【010】前端开发

摘要:目有个交互需要实现手指滑动的交互,pc端使用mousedown,mousemove,mouseup监听实现。 但在ios设备上mousemove是不好监听的,同类的方法是touchstart,touchmove,touchend。 项目需求,需要用到拖动事件。由于不需要考虑IE8等低端浏览器的兼容性 阅读全文
posted @ 2019-09-23 10:11 给时光以生命 阅读(2915) 评论(0) 推荐(0)
摘要:关于旧版本 Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。 现在用npm安 阅读全文
posted @ 2019-09-18 20:32 给时光以生命 阅读(4126) 评论(0) 推荐(1)
摘要:grid目前兼容性目前还可以,主流浏览器对它的支持力度很大,ie9,10宣布它未来不久会对它有很好的支持,目前则需要使用过时的语法。我相信不久的将来grid将成为每一个前端工作人员必备的布局技能。 属性介绍 1.父元素上的属性 2.设置子元素上的属性 阅读全文
posted @ 2019-09-18 09:29 给时光以生命 阅读(1259) 评论(0) 推荐(0)
摘要:前言 昨日在公众号中挖掘到了一个 XSS 安全漏洞,目前该漏洞已经上报给腾讯,具体复现流程如下: 漏洞产生过程 现在我们来分析下这个漏洞的产生过程: 首先标题中存在 HTML <input onfocus="alert('1')">,在网页中如果不对这部分文本做转义的话,就会正常渲染为 HTML。 阅读全文
posted @ 2019-09-12 10:55 给时光以生命 阅读(1070) 评论(0) 推荐(0)
摘要:首先,先吓唬一下我们的小白们!在js中的描述宽高的可以细分有22种。属性根据不同的兼容性也分为五种 window.innerWidth //除去菜单栏的窗口宽度,与浏览器相关 window.innerHeight//除去菜单栏的窗口高度,与浏览器相关 window.outerWidth//包括菜单栏 阅读全文
posted @ 2019-09-11 21:51 给时光以生命 阅读(698) 评论(0) 推荐(1)
摘要:前端需要性能优化么? 性能优化一直以来都是前端工程领域中的一个重要部分。很多资料表明,网站应用的性能优化对于提高用户留存、转化率等都有积极影响。可以理解为,提升你的网站性能,就是提升你的业务数据(甚至是业务收入)。 性能优化广义上包含前端优化和后端优化。后端优化的关注点更多的时候是在增加资源利用率、 阅读全文
posted @ 2019-09-11 11:41 给时光以生命 阅读(1043) 评论(0) 推荐(0)
摘要:1、浏览器的同源安全策略 没错,就是这家伙干的,浏览器只允许请求当前域的资源,而对其他域的资源表示不信任。那怎么才算跨域呢? 2、CORS 这是W3C的大佬们搞出来的标准,全称是"跨域资源共享"(Cross-origin resource sharing)。其实呢,这个大部分还是后端人员的工作。我们 阅读全文
posted @ 2019-09-09 11:48 给时光以生命 阅读(554) 评论(0) 推荐(0)
摘要:前言 在前端开发中,缓存有利于加快网页的加载速度,同时缓存能够被反复利用,所以可以减少流量和带宽的开销。 缓存的分类有很多种,CDN缓存、数据库缓存、代理服务器缓存和浏览器缓存。本篇将来讲解一下Web开发中的浏览器缓存。这个在实际开发环境中往往也会被问到,或者使用到。如何去准确认清楚缓存的概念,是前 阅读全文
posted @ 2019-08-01 19:49 给时光以生命 阅读(366) 评论(0) 推荐(0)
摘要:前言 浏览器缓存是浏览器端保存数据用于快速读取或避免重复资源请求的优化机制,有效的缓存使用可以避免重复的网络请求和浏览器快速地读取本地数据,整体上加速网页展示给用户。浏览器端缓存的机制种类较多,总体归纳为九种,这里详细分析下这九种缓存机制的原理和使用场景。打开浏览器的调试模式——Applicatio 阅读全文
posted @ 2019-08-01 18:29 给时光以生命 阅读(1754) 评论(1) 推荐(0)
摘要:computed和watch的区别 computed特性 1.是计算值,2.应用:就是简化tempalte里面{{}}计算和处理props或$emit的传值,computed(数据联动)。3.具有缓存性,页面重新渲染值不变化,计算属性会立即返回之前的计算结果,而不必再次执行函数 watch特性 1. 阅读全文
posted @ 2019-07-25 22:55 给时光以生命 阅读(2042) 评论(1) 推荐(0)
摘要:nvm 是 node.js 的版本管理工具,可以运行在多种操作系统上。nvm for windows 是使用go语言编写的软件。 我电脑使用的是Windows操作系统,所以我要记录下在此操作系统上nvm的安装和使用。 下载 nvm-windows 最新下载地址:https://github.com/ 阅读全文
posted @ 2019-07-22 12:17 给时光以生命 阅读(51881) 评论(1) 推荐(2)
摘要:ES6标准新增了一种新的函数:Arrow Function(箭头函数)。 为什么叫Arrow Function?因为它的定义用的就是一个箭头: 语法: 那么箭头函数有哪些特点? 更简洁的语法 没有this 不能使用new 构造函数 不绑定arguments,用rest参数...解决 使用call() 阅读全文
posted @ 2019-07-21 17:15 给时光以生命 阅读(12012) 评论(0) 推荐(0)
摘要:想必学过javascript函数的同学想必能细心的发现,同样是函数,为什么有个函数要加上new关键字呢,加上他们的意义又是什么,作用于什么场景,下面我们就来给大家详细介绍一下。 问题 什么是构造函数? 构造函数的优点与缺点? 构造函数与普通函数区别是什么? 用new关键字的时候到底做了什么? 构造函 阅读全文
posted @ 2019-07-21 11:55 给时光以生命 阅读(1340) 评论(0) 推荐(0)
摘要:display的table和table-cell一般情况下用的不多,所以很少有人去关注它,但他们两个联手起来会给你惊喜! 当两个或者两个以上标签一起使用显示在同一行时,以前常用的是float、position进行布局,在高版本的浏览器可以使用flex、grid进行布局。无意中发现使用display: 阅读全文
posted @ 2019-07-19 02:03 给时光以生命 阅读(34062) 评论(0) 推荐(4)
摘要:合理的title、description、keywords:搜索对着三项的权重逐个减小,title值强调重点即可,重要关键词出现不要超过2次,而且要靠前,不同页面title要有所不同;description把页面内容高度概括,长度合适,不可过分堆砌关键词,不同页面description有所不同;ke 阅读全文
posted @ 2019-07-03 10:36 给时光以生命 阅读(288) 评论(0) 推荐(0)
摘要:ES6 提供三个新的方法 —— entries(),keys()和values() —— 用于遍历数组。它们都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。 一、一般数组用法 for 阅读全文
posted @ 2019-07-01 18:05 给时光以生命 阅读(6215) 评论(0) 推荐(0)
摘要:ES6 提供了新的数据结构 Set以及Map,下面我们来一一讲解。 一、Set 特性 似于数组,但它的一大特性就是所有元素都是唯一的,没有重复。 我们可以利用这一唯一特性进行数组的去重工作。 1.单一数组的去重 let set6 = new Set([1, 2, 2, 3, 4, 3, 5]) co 阅读全文
posted @ 2019-07-01 13:51 给时光以生命 阅读(1052) 评论(0) 推荐(0)
摘要:event.target 获取的是触发事件的标签元素 event.currentTarget 获取到的是发起事件的标签元素 一、事件属性:event.target target事件委托的定义:本来该自己干的事,但是自己不干,交给别人来干 例子1 1 <!DOCTYPE html> 2 <html> 阅读全文
posted @ 2019-06-30 14:54 给时光以生命 阅读(6424) 评论(0) 推荐(0)
摘要:前言 首先我们先来了解一下什么叫栈堆,基本数据类型与引用数据类型 1.栈(stack)和堆(heap)stack为自动分配的内存空间,它由系统自动释放;而heap则是动态分配的内存,大小也不一定会自动释放。 2.基本的数据类型:String, Number, boolean, Null, Undef 阅读全文
posted @ 2019-06-27 22:43 给时光以生命 阅读(2955) 评论(0) 推荐(0)
摘要:HTML存在许多种类型的标签,有的标签下面只允许特定的标签存在,这就叫HTML嵌套规则。不按HTML嵌套规则写,浏览器就不会正确解析,会将不符合嵌套规则的节点放到目标节点的下面,或者变成纯文本。关于HTML嵌套规则,一定要掌握块状元素和内联元素的区别。 块状元素: 一般是其他元素的容器,可容纳内联元 阅读全文
posted @ 2019-06-24 12:30 给时光以生命 阅读(1000) 评论(0) 推荐(0)