自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

KDDA的博客

Thinking changes the world.

  • 博客(14)
  • 收藏
  • 关注

原创 ES6常用知识点解析

ES6常用知识点解析一、let和const命令let命令1. 基本用法ES6新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defined 只在块级作用域有效b // 1适用场景for循环的计数器,就很合适使用let命令。// ES5for (var i = 0; i < 10; i++) {}co

2021-03-15 18:50:03 178

原创 HTTP预请求

转载、参考:http://levy.work/2016-09-01-why-got-options-request-via-ajax/http://blog.csdn.net/u012017645/article/details/54315923https://segmentfault.com/q/1010000007963647http://www.tangshuang.net/2271.html预请求的原因是浏览器对简单跨域请求和复杂跨域请求的处理区别。XMLHttpReques

2020-07-14 16:37:19 874

原创 JS 中的 offsetWidth、clientWidth、scrollWidth、innerWidth、outerWidth 区别

*注:offsetWidth和clientWidth由于盒模型的不同,导致计算结果有所差异。 本文将讨论 box-sizing: content-box; 与 box-sizing: border-box; 两种场景下的计算情况。 若读者不清楚这两种盒模型的差异,请自行查看box-sizing一、offsetWidth 和 offsetHeigh...

2019-11-07 02:07:52 846

原创 shim 和 polyfill 有什么区别

在JavaScript的世界里,有两个词经常被提到,shim 和 polyfill,它们指的都是什么,又有什么区别?首先 shim 和 polyfill 都是为了解决环境兼容性,利用旧环境的现有 API 实现一些新的、当前环境不支持的特性。 其中 polyfill 特指新 API 是遵循标准的。举个栗子:jQuery 的 $.ajax 利用 XMLHttpRequest 对象和 Activ...

2018-12-07 11:37:50 3743 1

原创 CSS 绘制三角形

一、WHY ? 为什么要用CSS画三角形?三角形的绘制在前端开发中有很多应用场景,比如聊天气泡、按钮浮层等。一般实现的话有两种方式:1. 直接用切图,这是比较偷懒的方式,    优点:开发快    缺点:图形本身不够灵活,依赖切图、会消耗一次请求资源2. 使用CSS绘制    优点:灵活、不消耗请求资源,渲染更快*由上可知,本着能省则省的原则,使用CSS绘制能够减少...

2018-12-04 15:01:25 214

原创 Chrome 火焰图

对于 Web 开发者来说,Chrome 是首选开发浏览器之一,因其丰富的调试工具,大大加了快 debug 效率。那么除了常用的断点调试、网络请求等功能,Chrome 还提供了火焰图分析,下面就来介绍一下基于 Chrome 浏览器的火焰图调试和使用方法。首先打开控制台,切换到 Performance 面板,点击左上角的刷新按钮(当然也可以使用 record 按钮),等页面刷新完毕后会生成一张火焰...

2018-09-17 14:28:21 5116

原创 Vue 项目中的 Promise 兼容问题

最近在一些旧型号手机上开发的时候,发现会有报错 "Promise is not defined" ,原因是低版本浏览器不支持 Promise,所以需要一个合适的方案来兼容。以基于 vue 的项目为例,可以借助 es6-promise 包实现,具体方式如下:1. 先下载依赖npm i es6-promise --save-dev2. 在入口文件中引入 es6-promise 包,并使用...

2018-08-13 15:02:32 4528

原创 Vue 单页应用 动态修改页面 title

使用 Vue + VueRouter 开发单页应用时,有些需要修改页面 title 的场景,可以通过在 router 中添加 meta 元信息来实现:routes: [{ name: 'home', path: '/home/:openname', component: Home, meta: { title: '首页' }}]添...

2018-03-23 11:44:12 3184

原创 百度地图JS定位

之前做百度地图定位时写的调用方法,在这里记录下。 PS:此处引入的是v1.2版本的API,非最新版本。一、获取地理位置方法 var getLocation = function() { var options = { enableHighAccuracy: true, maximumAge: 1000 } if (navigato

2017-04-02 18:08:37 686

原创 Masonry实现JS瀑布流

瀑布流布局在很多网站都有应用,也是从国外流行起来的一种不规则布局,想要在网页端实现瀑布流效果可以借用Masonry插件。一、引入Masonry文件可以去官网下载到本地,也可以直接引入CDN,还可以用npm等包管理工具直接下载。此处用CDN引入。官网地址:http://masonry.desandro.com二、编写html结构和样式

2016-01-25 11:42:55 5843

原创 JS使用call函数实现继承

JS是一门轻量级的语言,不支持高级语言的继承语法,但是可以通过call或apply函数(这两个函数实现结果一样,用法略有不同,本文主要讲解call函数的使用方法)实现继承的效果,下面举个例子来讲解。一、call函数的使用方法// 基类var father = function() { this.say = function() { alert('父亲'); }}// 子类v

2016-01-25 00:25:10 1563

原创 JS判断手机纵向滑动

要实现该效果需要用到三个H5中的新增事件:touchstart、touchmove和touchend。touchstart事件:当手指触摸屏幕时候触发,即使已经有一个手指放在屏幕上也会触发。touchmove事件:当手指在屏幕上滑动的时候连续地触发。在这个事件发生期间,调用preventDefault()事件可以阻止滚动。touchend事件:当手指从屏幕上离开的时候触发。下面写个

2016-01-18 17:21:48 2809

原创 Mac下MySQL的安装和使用

一、安装1. 从官网下载dmg文件(当然也可以下载压缩包)。2. 下载完成后有个pkg文件,点击安装。安装完成时会跳出个框框,上面是root用户的默认密码(第一次安装才会有,如果之前安装过必须先卸载干净,彻底卸载详情见http://blog.csdn.net/fableboy/article/details/41882031),如下图:二、启动服务安装好后先要启动MyS

2015-12-28 22:47:32 517

原创 Chrome下cookie无法使用

最近在研究妹子UI,在用到cookie的时候发现调用API没有效果,本来以为是调用方法错误,特意换成了自己写的getCookie()和setCookie(),结果还是存不进。想着换个浏览器试试,果然,换成Firefox就没问题了,所以猜测问题出在浏览器上。查了下发现,Chrome不支持本地使用cookie,Chrome浏览器为了安全只支持online-cookie。也就是,本地不可以设置cooki

2015-09-09 17:58:50 881

空空如也

空空如也

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

TA关注的人

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