- 博客(23)
- 收藏
- 关注
RSS订阅转载 border-image
参考链接: border-image 的正确用法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g...
2018-06-17 16:10:00
94
转载 Date 使用小结
Date 使用小结一、介绍ECMAAScript 中的 Date 类型是早期 Java 中的 java.util.Date 类基础上构建的。因此，Date类型使用自 UTC ( Coordinated Universal Time，国际协调时间，以本初子午线的平子夜起算的平太阳时。又称格林尼治平时或格林尼治时间。各地的地方平时与世界时之差等于该地的地理经度) 1970 年 1 月 1...
2018-04-04 11:09:00
119
转载 关于 promise 吃到错误的理解
关于 promise 吃到错误的理解下面的内容需要对浏览器原生支持的 promise 的基本用法有了解，如果你还不知道 promise 和 promise 的 catch 方法，你可能需要先在 这里 了解一下。在 阮一峰大神的 《ECMAScript 6 入门》 关于 Promise 对象那一章在介绍 Promise.prototype.catch() 方法时，里面有一句描述是这样写...
2018-03-21 12:57:00
170
转载 跨域对接方法总结
一、后台跨域-V11. 后台设置配置过滤器，为所有的响应头都加上 下面四个字段Access-Control-Allow-Origin: '具体源' ：允许通过跨域访问后台服务器的源。如果需要使用section来标示不同的会话，则需要前端设置允许cookie（因为浏览器是通过发送cookie中相关的ID ( JSESSIONID )来标识的），并且后台的 Access-Cont...
2018-03-15 00:33:00
126
转载 flex 布局
flex 布局1. 图例2. 容器的属性1) flex-direction 属性属性决定主轴的方向（即项目的排列方向）flex-direction: row | row-reverse | column | column-reverse;row（默认值）：主轴为水平方向，起点在左端row-reverse：主轴为水平方向，起点在右端column：主轴为垂直方向，起点在上...
2018-03-13 00:05:00
66
转载 改造 vue-cli 脚手架
改造 vue-cli 脚手架注意，这里使用的 vue-cli 的版本为 2.8.2，不同版本的 vue-cli 可能会有些许不一样。一、配置多页面项目开发目录：需要注意一点，每个页面的文件夹命名、文件夹里面的入口 js 文件名及 hmtl 模板文件名应该一致，这样就可以使用一个函数来自动配置入口文件，而不必手动配置project/ ├──build/ ├──co...
2018-03-09 19:47:00
113
转载 CSS3 选择器
CSS3 选择器一、css hack让指定的浏览器识别该 css 规则，其他浏览器将忽略改规则* : ie6, ie7*+ : ie7- : ie6\0 : ie8\9 : ie6~ie9二、选择器1. 基本选择器选择器含义*****通用元素选择器，匹配任何元素E标签选择器，匹配所有使用E标签的元素.infoclass选择器，...
2018-03-08 16:37:00
85
转载 离线应用与客户端存储
一、离线检测1. 属性navigation.onLine 返回 true / false2. 事件online事件，从离线变为在线时触发offline事件，从在线变成离线时触发二、应用缓存HTML5 的应用缓存（application cache），简称 appcache，是专门为开发离线 Web 应用而设计的。1. 描述文件该文件用于描述需要下在和缓存的资源，其文...
2018-03-08 01:04:00
94
转载 跨文档消息传递 postMessage
一、跨文档消息传递1. postMessage发送信息向当前页面的 <iframe> 元素传送数据// 接收方window对象.postMessage( "message", "接收方域名" ); var iframeWindow = document.getElementById("myframe").contentWindow; //contentWindo...
2018-03-06 18:04:00
190
转载 CSS3 Tranform 3D 的应用
CSS3 Tranform 3D 的应用一、perspective 属性1. 作用：设置元素被查看位置的视图，类似于眼睛到屏幕的距离，一般跟 perspective-origin 共同作用在一个父元素上属性值 = 屏幕分辩率 * 屏幕和我们眼睛的距离当为元素定义 perspective 属性时，其子元素会获得透视效果，而不是元素本身perspective 属性只影响 3D ...
2018-03-05 21:25:00
171
转载 输入框与显示框
输入框与显示框之前做一个项目的时候需要实现怎么一个场景，有一个做题网站，需要有一个输入框和一个显示框。输入框可以给用户输入简答题答案，为了让用户有更好的输入体验，需要可以支持 换行符，并且在数据的数据行数超过原来设定好的输入框的高度时，输入框的 高度自动增加，让用户能在屏幕上尽量多的看到其输入的数据。而之后用户查看答案时直接把按其输入时的排版显示在显示框中（显示框的高度由要显示的内...
2018-03-04 14:41:00
243
转载 Vue 非父子组件通信方案
Vue 非父子组件通信方案概述在 Vue 中模块间的通信很普遍如果是单纯的父子组件间传递信息，父组件可以使用 props 将数据向下传递到子组件，而在子组件中可以使用 events （父组件需要先监听对应子组件触发的事件） 向父组件传递信息。但是当我们需要进行非父子组件间的通信或者是父子组件间的通信需要层层传递过于复杂时就需要使用非父子组件通信方案来进行组件间信息的传递：下面是...
2018-03-04 14:39:00
302
转载 JavaScript设计模式(10)-观察者模式
观察者模式1. 介绍发布者与订阅者是多对多的方式通过推与拉获取数据：发布者推送到订阅者或订阅者到发布者那边拉使并行开发的多个实现能彼此独立地进行修改其实我们在前端开发中使用到的时间监听就是浏览器实现的观察者模式2. 示例：订阅报纸function Publisher() { this.subscribers = [];}Publisher.prototype...
2018-03-02 15:45:00
54
转载 JavaScript设计模式(9)-享元模式
享元模式1. 介绍一种优化模式适合解决因创建大量类似对象而累积性能问题javaScript 代码可能很快就用光浏览器的内容，通过把大量独立对象转化为少量共享对象，可以降低运行 Web 应用所需的资源数量。对一连用上几天也不会重新加载的大型应用系统比较有用，对打开时间短的小型网页作用不大JavaScript 对象需要创建 HTML 内容的情况下，享元模式特别有用。2. 享...
2018-03-02 15:31:00
79
转载 JavaScript设计模式(8)-装饰者模式
装饰者模式1. 作用：可用来透明地把对象包装在具有同样接口的另一对象之中，这样可以给一个方法添加一些行为，然后将方法调用传递给原始对象。可用于为对象增加功能，用来代替大量子类。装饰者对其组件进行了透明包装，二者可以互换使用，因为他们 实现了同样的接口2. 例子：自行车function extend(subClass, superClass) { var F = f...
2018-03-02 14:45:00
70
转载 JavaScript设计模式(7)-设配器模式
适配器模式1. 作用：协调两个不同的接口2. 适用场景适配器适用于客户期待的接口与现有 API 提供的接口不兼容这种场景。他只能用来协调语法上的差异问题。适配器所适配的两个方法执行的应该是类似的任务，否则的话他就解决不了问题。3. 适配器的利与弊：利：有助于避免大规模的改写现有的客户代码对大型系统和遗留框架的情况下，其作用比较有优势弊：需引入一批需要支持的...
2018-03-02 13:11:00
85
转载 JavaScript设计模式(6)-门面模式
门面模式门面模式(Facade Pattern)：他隐藏了系统的复杂性，并向客户端提供了一个可以访问系统的接口。这种类型的设计模式属于结构性模式。为子系统中的一组接口提供了一个统一的访问接口，这个接口使得子系统更容易被访问或者使用。1. 作用：简化类的接口消除类与使用它的客户代码之间的耦合2. 设计一个事件工具window.DED = window.DED || {};...
2018-03-02 12:24:00
90
转载 JavaScript设计模式(5)-组合模式
组合模式1. 适合使用组合模式的条件：存在一批组织成某种层次体系的对象，如树形结构（具体的结构在开发期间可能无法得知）希望对这批对象或其中的一部分对象实施一个相同的操作2. 注意点：组合对象与其所有子对象具有相同的接口，但是叶对象并没有继承其上一级组合对象，不是超类与子类的关系3. 例子：表单信息保存及恢复可以指定整个表单保存输入数据，及恢复保存的数据，也可以只保存...
2018-03-02 12:05:00
69
转载 JavaScript设计模式(4)-桥接模式
桥接模式在设计一个 Js API 时，可用来弱化它与使用它的类和对象之间的耦合1. 事件监听器的回调函数function getBeerById(id, callback) { asyncRequest('GET', 'beer.uri?id=' + id, function(res){ callback(resp.responseText) })...
2018-03-02 11:28:00
83
转载 JavaScript设计模式(3)-工厂模式
工厂模式1. 简单工厂简单工厂：使用一个类或对象封装实例化操作假如我们有个自行车商店类 BicycleShop，它提供了销售自行车的方法可以选择销售两类自行车 Speedster，ComfortCruiser，那么确定要销售那种自行车就可以通过简单工厂来实现。注意：后面的代码中会用到 Javascript设计模式(1) 里面讲到的接口类 Interface 和 继承函数 exte...
2018-03-02 01:23:00
59
转载 JavaScript链式调用
方法的链式调用1. 调用链的结构链式调用的核心就是在调用方法中返回调用该方法的对象的引用，即 return this;下面我们模范 JQuery 来实现一个简单的链式调用接口，通过 $() 方法获取元素对象，并提供三个链式调用方法 each(callback)，setStyle，addEvent(function() { function _$(els) { ...
2018-03-02 01:02:00
104
转载 Javascript设计模式(2)-单体模式
单体模式1. js最简单的单体模式对象字面量：把一批有一定关联的方法和属性组织在一起// 对象字面量var Singleton = { attr1: true, attr2: 10, method1: function() {}, method2: function(arg) {}}// 配合命名空间var GiantCorp = {}G...
2018-03-02 00:59:00
85
转载 Javascript设计模式(1)
本文是学习了《JavaScript设计模式》（谢廷晟 译）做的学习笔记一、JavaScript的灵活性1. 普通 functon function startAnimation() {...} function stopAnimation() {...}2. 类 var Anim = function() {} #构造函数 # 方式一 ...
2018-03-01 20:08:00
69
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人