2017年07月_其实还很远

原创 zepto classnames

如果基于zepto.js开发，一般是通过event.touches[0]来获取属性。重要属性如下：clientX,clientY:触摸点相对于浏览器窗口viewport的位置;pageX,pageY:触摸点相对于页面的位置;screenX,screenY：触摸点相对于屏幕的位置 ;identifier:touch对象的unique ID touchs

2017-07-24 10:50:35 328

原创 git

想看到最近一次提交所有更改过的文件对应命令 git log -n 1 --stat

2017-07-24 10:49:25 150

转载新技术

service worker 代理请求progressive web appweexfex yogafacebook 布局引擎 yogaleetcode.org docker

2017-07-24 10:48:22 143

原创 input的placeholder的兼容性问题

input::-webkit-input-placeholder{ color: #787878; } input::placeholder{ color: #787878; } input::-ms-input-placeholder{ color: #787878; }input:-moz-placeholder{color: #787878;

2017-07-24 10:47:42 606

原创前端跨域请求原理及实践

一、跨域请求的含义一般的，只要网站的协议名protocol、主机host、端口号port这三个中的任意一个不同，网站间的数据请求与传输便构成了跨域调用。这说明跨域请求并非是浏览器限制了发起跨站请求，而是请求可以正常发起，到达服务器端，但是服务器返回的结果会被浏览器拦截。二、利用 JSONP实现跨域调用JSONP 是 JSON的一种使用模式，可以解决主流浏览器

2017-07-24 10:44:29 189

转载 cookie

2017-03-16详解 Cookie 纪要cookie规范定义了服务器和客户端交互信息的格式、生存期、使用范围、安全性。 Cookie通常用来存储一些不是很敏感的信息，或者进行登录控制，也可用来记住用户名、记住免密码登录、防止刷票等。每个域名下允许的Cookie是有限制的,个域名的每个Cookie限制以4千字节（KB）键值对的形式存储。还有一种Cookie

2017-07-24 10:43:46 174

原创 fish

Fish shell 入门教程1 安装：sudo apt-get install fishbrew install fish2 启动与帮助fish3配置fish_config

2017-07-24 10:41:43 239

原创 npm淘宝

npm淘宝镜像 npm install cnpm -g --registry=https://registry.npm.taobao.org

2017-07-24 10:40:10 188

原创移动端响应rem dpr viewport设置

(function () { var t; function initHtmlFont(){ var maxWidth = 640; var html = document.documentElement; var windowWidth = html.clientWidth;

2017-07-24 10:32:23 1318

原创成为ui设计师的准备工作

1. 工具安装 sketch3 AI axure AE 百度搜索 xxxx＋百度云 cc版本2 比看网站 www.zcool.com.cn www.dribbble.com www.ui.cn www.uisc.com3 推荐书籍《简约之上》

2017-07-24 10:30:45 364

转载基于html中canvas标签的验证码图片生成方法

基于html中canvas标签的验证码图片生成方法小前端一只,在自己网站中写了一个留言功能,需要随机生成验证码,发现网上大多是用后台技术生成,无奈本人看不明白,无奈之下（其实从安全角度来看图片验证码还是后台传过来比较好，前端生成没啥子意义 ╮(︶﹏︶)╭） "canvas" width="120" height="40"> "#" id="cha

2017-07-20 18:08:11 323

转载 html2canvas 将html代码转为图片

http://blog.csdn.net/jiangzunshao/article/details/53040908转换代码到图片使用html2canvas，这是一个非常著名的从浏览器网页截图的开源库，使用很方便，功能也很强大。使用 html2canvas html2canvas 的使用非常简单，简单到只需要传入一个 DOM 元素，然后通过回调拿到 canvas：

2017-07-20 16:57:20 206

原创文章标题

mongoDbMongoDB国内官方网站:www.mongoing.com 数据库： 1.有组织的存放数据。 2.按照不同的需求进行查询。 Mongodb的优点 1.无数据结构限制 a.没有表结构的概念，每条记录可以有完全不同的结构 b.开发业务方便快捷 c.sql数据库需要事先定义表结构才可以使

2017-07-17 20:35:47 206

原创浅谈前端移动端页面开发（布局篇）

前言的一些碎碎念：最近一直在写移动端的页面，不过一直是用的别人造好的轮子，很多时候并没有想那是为什么，那是怎么样要那么写，就跟着别人的文档去了。本以为自己对移动端的那一丢丢理解，结果很多东西都特么有问题，所以，今天停下了手中的一些东西，来谈下移动端的布局方案吧内容有些长，这也是我第一次写博客，不足之处还请严厉指出一. viewport什么是viewport简单来讲，vie

2017-07-17 19:49:28 550

原创 http洗衣额详解

情景，当我们在浏览器中输入www.baidu.com时 1. 浏览器会检索自身的dns缓存； 2. 搜索操控系统的本身的dns缓存，缓存失效 3 . 读取本地host文件 4. 浏览起发起dns系统调用； 5 . 宽带运营商服务器查看本身DNS缓存 6. 运营商服务器发起一个迭代的DNS解析的请求7. 运营商服务器把结果返回给操

2017-07-17 18:56:18 246

原创 node.js的api url模块和querystring模块

url网址解析模块 url.parse url中url.parse()方法可以将一个URL解析成一个对象 const url = require('url'); url.parse("")将url转化为对象....... url.parse("http://www.imooc.com/video/6710",true).href

2017-07-17 18:27:43 299

原创 node.js

nodejs可以使 javascript 流畅的运行在服务器端，采用谷歌chrome浏览器V8引擎，由C++语言编写，实质上是一个javascript运行环境，浏览器端javascript运行交互组件，异步请求是通过浏览器解析插件来解析页面的js代码，nodejs不仅可以解析JS代码，而且还没有

2017-07-17 17:22:38 382

原创 react的动画ReactCSSTransitionGroup

react的动画用法 ReactCSSTransitionGroup 项目中安装 npm install --save -dev react-addons-css-transition-group 项目中使用 import ReactCSSTransitionGroup from 'react-addons-css-transition-group'; 组建中

2017-07-17 17:12:35 1509

转载通过HTML5 FileReader实现上传图片预览功能

在上传图片到服务器之前，我们希望可以预览一下要上传的图片。这个功能可以通过HTML5 的FileReader()方法来实现。FileReader是html5 File API的一部分。它实现了一种异步文件读取机制。可以把FileReader想象为XMLHttpRequest，区别只是它读取的是文件系统，而不是远程服务器。为了读取文件中的数据，FileReader提供了如下几个方法。re

2017-07-17 15:55:47 881

原创前端的发展史

最早的html页面是完全静态的页面，预先编译好的存放在web服务器上的html文件。浏览器请求某个url时，web服务器把对应的html文件扔给浏览器，现实网页，而动态创建html文件的方式：asp。jsp，php【第一阶段】是JS原生通过浏览器解析机制，它的原理是使用浏览器提供的原生API 结合JS语法，可以直接操作DOM 【第二阶段】jQue

2017-07-17 14:48:22 290

原创 2017-03-21 Flex布局新旧混合写法详解（兼容微信） http://www.tuicool.com/articles/Yzeu6j7

2017-03-21Flex布局新旧混合写法详解（兼容微信）http://www.tuicool.com/articles/Yzeu6j7

2017-07-13 14:45:19 530

原创 ACCC

2017-04-05 https://juejin.im/entry/58e11c5644d904006d16f4e5文本动画, 几行代码页面效果瞬间就提升了animate-text 安装方法 npm install animate-text --save 下载项目中的dist/anim

2017-07-13 14:43:22 248

原创 A1

2017-04-06https://juejin.im/post/58ddfeb7b123db0060406148前端周刊第 49 期：React 和 Vue.js SSR 框架 + 微信小程序 + Grid 布局 grid布局 1. 创建一个容器，通过display:grid;声明这个容器是一个网格容器2. 同样在容器中设置grid-template-columns和

2017-07-13 14:42:23 181

原创欢迎使用CSDN-markdown编辑器

HTML email (elm制作) http://www.educity.cn/wenda/10014.html／／css选择器支持情况； EDM制作最基本的要点： 1.不能用div＋css布局，不能用浮动，定位；布局只能采用table实现，可以大表套小表，层次尽量精简，不要用多个 table 拼装； 2.css要嵌入到html元素中，不能内联，也不可外链，所有CS

2017-07-13 14:41:09 193

原创 REM

(function () { var t; function initHtmlFont(){ var maxWidth = 640; var html = document.documentElement;

2017-07-13 14:34:25 161

原创 chrome上安装插件

chrome安装插件步骤更多工具－－－扩展程序－－－广告拦截插件 adblock plus json试图工具 json handle 有道词典划词扩展v3 可以打开chrome应用商店去安装，自选

2017-07-10 10:41:46 344

原创 react

react组件apati 设置状态 this.setState( { }) 在react中使用尖头函数注意 1，安装依赖 npm install --save-dev babel-preset-es2015 npm install--save-dev babel-preset-r

2017-07-07 15:52:06 160

原创变量的解构赋值

let { foo: a, bar:b } = { foo: "aaa", bar: "bbb" }; 被赋值的是ab变量也就是说，对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量。真正被赋值的是后者，而不是前者。let foo;({foo} = {foo: 1}); // 成功let obj = { p: [ 'Hello', { y:

2017-07-07 14:14:44 190

原创 react的es6写法

今天想起来把react的es5写法转为es6语法即react.createClass => react.component知识点1 let App = React.CreateClass({}) => class App extends Component{ }知识点2 每个函数之间去掉了逗号知识点3 props propTypes and

2017-07-06 17:56:42 238

转载如何利用AJAX进行文件的上传，并对上传内容进行限制，在项目中总会遇见这样的问题，下面就为大家举个栗子。 HTML代码 <form id="uploadForm" enctype="multipar

如何利用AJAX进行文件的上传，并对上传内容进行限制，在项目中总会遇见这样的问题，下面就为大家举个栗子。 HTML代码form id="uploadForm" enctype="multipart/form-data">//enctype必须要设置为multipart/form-data input id="file" type="file" name="avater" acce

2017-07-04 17:06:11 264

原创 vue-cli架构

安装 npm install vue-cli -g 初始化 npm init webpack my-project//webpack 模版的项目

2017-07-04 17:05:34 177

原创 1231

vue饿了末 home页顶部组件用了slot插槽 slot的用法，，，父组件中slot作为属性，自组件中slot作为插槽点，把父组件中的slot属性的dom插进来

2017-07-04 16:05:34 171

原创 flex布局

flex布局容器flex属性 flex-direction flex项目的排列方向 row column row-reverse column-reverse flex-wrap flex项目是否换行 wrap nowrap wrap-reverse flex-flow :flex-direction f

2017-07-03 10:18:00 200

原创 111

function fun(n,o) { console.log(o)return {fun:function(m){return fun(m,n); } };}var a = fun(0);//生命了但为初始化 a.fun(1); a.fun(2); a.fun(3);//undefined,?,?,?var b = fun(0).f

2017-07-01 14:50:15 148

running_shuai的博客