自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(61)
  • 收藏
  • 关注

转载 从event loop规范探究javaScript异步及浏览器更新渲染时机

异步的思考 event loops隐藏得比较深,很多人对它很陌生。但提起异步,相信每个人都知道。异步背后的“靠山”就是event loops。这里的异步准确的说应该叫浏览器的event loops或者说是javaScript运行环境的event loops,因为ECMAScript中没有ev...

2019-07-10 14:00:00 152

转载 element-ui打包和运行报错处理

最近在使用webpack打包过程中遇到element-ui报错。 说明一下情况:之前在原有的配置文件和node_modules依赖包下打包的过程中,一直都很顺利,但是突然就报错了,很尴尬啊! 1 ERROR in static/js/vendor.dcbf487ca944c251ac...

2019-07-10 14:00:00 585

转载 npm -D -S 的区别

我们在使用npm install 安装模块或插件的时候,有两种命令把他们写入到 package.json 文件里面去,比如: --save-dev --save 在 package.json 文件里面提现出来的区别就是,使用 --save-dev 安装的 插件,被写入到 devDepen...

2019-07-10 14:00:00 92

转载 JavaScript异步编程__“回调地狱”的一些解决方案

异步编程在JavaScript中非常重要。过多的异步编程也带了回调嵌套的问题,本文会提供一些解决“回调地狱”的方法。 setTimeout(function () { console.log('延时触发'); }, 2000); fs.readFile('...

2019-07-10 14:00:00 120

转载 touch事件中的touches、targetTouches和changedTouches详解

touches: 当前屏幕上所有触摸点的列表; targetTouches: 当前对象上所有触摸点的列表; changedTouches: 涉及当前(引发)事件的触摸点的列表 通过一个例子来区分一下触摸事件中的这三个属性: 1. 用一个手指接触屏幕,触发事件,此时这三个属性有相同的值。...

2019-07-10 14:00:00 644

转载 js 预解析

前言 JavaScript是解释型语言是毋庸置疑的,但它是不是仅在运行时自上往下一句一句地解析的呢? 事实上或某种现象证明并不是这样的,通过《JavaScript权威指南》及网上相关资料了解到,JavaScript有“预解析”行为。理解这一特性是很重要的,不然在实际开发中你可能会遇到很多无...

2019-07-10 14:00:00 91

转载 三分钟教你同步 Visual Studio Code 设置

简介 Visual Stud...

2019-07-10 14:00:00 634

转载 vw+vh+rem响应式布局

科普下: 平时很少用的css单位: 1.长度单位: rem:相对长度单位。相对于根元素(即html元素)font-size计算值的倍数; vw:相对于视口的宽度。视口被均分为100单位的vw; vh:相对于视口的高度。视口被均分为100单位的vh; vmax:相对于视口的宽度或高度...

2019-07-10 14:00:00 201

转载 滚动图片懒加载

本文主要通过以下几方面来说明懒加载技术的原理,个人前端小菜,有错误请多多指出 一、什么是图片滚动加载?   通俗的讲就是:当访问一个页面的时候,先把img元素或是其他元素的背景图片路径替换成一张大小为1*1px图片的路径(这样就只需请求一次),只有当图片出现在浏览器的可视区域内时,才设置图...

2019-07-10 14:00:00 127

转载 前端内容安全策略(csp)

什么是CSP CSP全称Content Security Policy ,可以直接翻译为内容安全策略,说白了,就是为了页面内容安全而制定的一系列防护策略. 通过CSP所约束的的规责指定可信的内容来源(这里的内容可以指脚本、图片、iframe、fton、style等等可能的远程的资源)。通过C...

2019-07-10 13:59:00 612

转载 js对象原型链

JavaScript 规定,每一个构造函数都有一个 prototype 属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的所拥有。 这也就意味着,我们可以把所有对象实例需要共享的属性和方法直接定义在 prototype 对象上。 function Person (nam...

2019-07-10 13:59:00 87

转载 前端安全系列:如何防止CSRF攻击?

背景 随着互联网的高速发展,信息安全问题已经成为企业最为关注的焦点之一,而前端又是引发企业安全问题的高危据点。在移动互联网时代,前端人员除了传统的 XSS、CSRF 等安全问题之外,又时常遭遇网络劫持、非法调用 Hybrid API 等新型安全问题。当然,浏览器自身也在不断在进化和发展,不断...

2019-07-10 13:59:00 280

转载 Vue生命周期函数详解

vue实例的生命周期 1 什么是生命周期(每个实例的一辈子) 概念:每一个Vue实例创建、运行、销毁的过程,就是生命周期;在实例的生命周期中,总是伴随着各种事件,这些事件就是生命周期函数; 生命周期:实例的生命周期,就是一个阶段,从创建到运行,再到销毁的阶段; 生命周期函数:在实例的...

2019-07-10 13:59:00 81

转载 在VSCode中配置Eslint格式化

在VSCode中配置Eslint 格式化时使代码保持Eslint语法规范 安装Eslint以及prettier美化插件 在VSCode配置设置项中添加如下代码 { "workbench.colorTheme": "Material Theme", "search...

2019-07-10 13:59:00 85

转载 ES6中let和const详解

let和var一样也是用来定义变量,不同之处在于let是块级作用域,只在所定义的块级作用域中生效,一个花括号便是一个块级作用域 {var a="我是var定义的";let b="我是let定义的"}console.log(a); //我是var定义的console.log(b...

2019-07-10 13:59:00 135

转载 如何理解HTTP协议的 “无连接,无状态” 特点?

HTTP 是一个属于应用层的面向对象的协议,HTTP 协议一共有五大特点:1、支持客户/服务器模式;2、简单快速;3、灵活;4、无连接;5、无状态。 无连接 无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求,并收到客户的应答后,即断开连接。采用这种方式可以节省传输时间...

2019-07-10 13:59:00 168

转载 常用ES6语法

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script t...

2019-07-10 13:59:00 69

转载 vue.js响应式原理解析与实现

从很久之前就已经接触过了angularjs了,当时就已经了解到,angularjs是通过脏检查来实现数据监测以及页面更新渲染。之后,再接触了vue.js,当时也一度很好奇vue.js是如何监测数据更新并且重新渲染页面。今天,就我们就来一步步解析vue.js响应式的原理,并且来实现一个简单的de...

2019-07-10 13:59:00 48

转载 ES6变量解构赋值

ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构ES6之前我们申明多个变量需要按照下面的方法: let l a=1;let b=2;let c=3;let d=4;//或者let a=1,b=2,c=3,d=4; ...

2019-07-10 13:59:00 96

转载 多列布局--瀑布流原理

多列布局 CSS3中新出现的多列布局(multi-column)是传统HTML网页中块状布局模式的有力扩充。这种新语法能够让WEB开发人员轻松的让文本呈现多列显示。我们知道,当一行文字太长时,读者读起来就比较费劲,有可能读错行或读串行;人们的视点从文本的一端移到另一端、然后换到下...

2019-07-10 13:59:00 87

转载 移动端常见问题及解决方案

移动端常见问题及解决方案 一、meta基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <metaname="viewport"content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maxim...

2019-07-10 13:59:00 282

转载 移动端base.css

html { color: #333; /*规定主色调,依据业务场景(非必须)*/ background: #F6F6F6; /*规定主背景,依据业务场景(非必须)*/ overflow-y: auto; /*如果有溢出自动形成...

2019-07-10 13:59:00 120

转载 实用且堪称神器的Chrome插件推荐

前言 相信很多人都在使用 Chrome 浏览器,其流畅的浏览体验得到了不少用户的偏爱,但流畅只是一方面, Chrome 最大的优势还是其支持众多强大好用的扩展程序(Extensions)。最近为了更好的利用谷歌浏览器,博主整理了一些常用的谷歌插件,分享给大家,考虑到一些无法FQ的童鞋,给力的...

2019-07-10 13:59:00 295

转载 flex 伸缩布局

伸缩布局 布局的传统解决方案,基于盒状模型,依赖display属性 +position属性 +float属性。它对于那些特殊布局非常不方便。CSS3在布局方面做了非常大的改进,使得我们对块级元素的布局排列变得十分灵活,适应性非常强,其强大的伸缩性,在响应式开中可以发挥极大的作用。 ...

2019-07-10 13:59:00 68

转载 html5shiv.js和respond.min.js

做页面常用的东西,写这里用的时候省点去找了。。。 html5shiv:解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题。 respond.min:让不支持css3Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。 由于IE6/IE7/IE...

2019-07-10 13:59:00 92

转载 Promise详解

前言 && 基础概念 Promise 是解决 JS 异步的一种方案,相比传统的回调函数,Promise 能解决多个回调严重嵌套的问题。 Promise 对象代表一个异步操作,有三种状态:pending、fulfilled 或 rejected,状态的转变只能是pend...

2019-07-10 13:59:00 92

转载 input type = number 去除上下箭头,禁用滚轮事件(默认的自带滚轮加减数字)

<style type="text/css"> /*盒子大小从边框开始计算*/ html * { box-sizing: border-box; } /*解决模态框抖动*/ html { o...

2019-07-10 13:59:00 894

转载 http协议详谈

scheme- 定义因特网服务的类型。最常见的类型是 httphost- 定义域主机(http 的默认主机是 www)domain- 定义因特网域名,比如 runoob.comport- 定义主机上的端口号(http 的默认端口号是 80)path- 定义服务器上的路径(如果省...

2019-07-10 13:59:00 373

转载 call、apply、bind用法区别

call call() 方法调用一个函数, 其具有一个指定的 this 值和分别地提供的参数(参数的列表)。 <p class="danger"> 注意:该方法的作用和 apply() 方法类似,只有一个区别,就是 call() 方法接受的是若干个参数的列表,而 apply()...

2019-07-10 13:59:00 75

转载 JavaScript:闭包

闭包 闭包:指有权访问另一个函数作用域中的变量的函数。 创建闭包的常见方式就是在一个函数内部创建另一个函数: function createComparisonFunction(propertyName) { return function (obj1, obj2)...

2019-07-10 13:59:00 48

转载 JavaScript:基本包装类型

为了方便操作,JavaScript提供了3个特殊的引用类型:Boolean、Number和String。实际上,每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而可以调用这些类型的方法来操作数据。 var s1 = "hello javasc...

2019-07-10 13:59:00 64

转载 h5移动端flexible源码适配终端解读以及常用sass函数

;(function(win, lib) { var doc = win.document;// win = window,lib = window.lib; var docEl = doc.documentElement; var metaEl = doc...

2019-07-10 13:59:00 73

转载 《转》15种CSS混合模式让图片产生令人惊艳的效果

浏览器支持 按照现在情况来讲,浏览器支持CSSbackground-blend-mode属性还在不断的完善中。早期版本的浏览器目前还不支持,但caniuse.com报告说在Chrome,Firefox和Opera的最新版本都有良好的支持,使用Safari最快。 目前,基于Chromiu...

2019-07-10 13:59:00 153

转载 vue组件独享守卫钩子函数参数详解(beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave)...

一样的和前面路由钩子类似的步骤 首先在demo下面的components下面新建一个test.vue组件 test组件代码 <template> <div class="test_box"> <p @click="go">测试组件...

2019-07-10 13:59:00 205

转载 浅谈ES6新特性

ES6的了解 新增模板字符串(为JavaScript提供了简单的字符串插值功能)、箭头函数(操作符左边为输入的参数,而右边则是进行的操作以及返回的值Inputs=>outputs。)、for-of(用来遍历数据—例如数组中的值。)arguments对象可被不定参数和默认参数完美代...

2019-07-10 13:59:00 73

转载 SEO方案

前端需要注意哪些SEO 合理的title、description、keywords:搜索对着三项的权重逐个减小,title值强调重点即可,重要关键词出现不要超过2次,而且要靠前,不同页面title要有所不同;description把页面内容高度概括,长度合适,不可过分堆砌关键...

2019-07-10 13:59:00 1013

转载 网站使用QQ登录问题小结

关于网站如何使用QQ登陆这个问题就不多说了,很简单,登陆connect.qq.com找到相应的SDK,下载下来,里面会有demo,将相应的appid,appkey和回调地址callback改成自己的就行了。本篇文章主要分享一下在这个过程可能出现的问题并总结一下解决问题的办法。 (1)使用已有...

2019-07-10 13:59:00 182

转载 H5打字机特效

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></hea...

2019-07-10 13:59:00 384

转载 rem自适应原理

rem自适应原理 rem是根据html的font-size大小来变化,正是基于这个出发,我们可以在每一个设备下根据设备的宽度设置对应的html字号,从而实现了自适应布局。更多介绍请看这篇文章:rem是如何实现自适应布局的。 rem的值 目前有两种,一种是根据js来调整html的字号,另一...

2019-07-10 13:59:00 696

转载 json常用方法和本地存储方法

1、JSON.parse()【把json字符串解析成json对象】 2、JSON.stringify()【把json对象中解析成json字符串】 <script> let obj = '{"name":"bob"}'; consol...

2019-07-10 13:59:00 675

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除