旅行的风筝

边框紧挨的变色框制作效果

当你在浏览器里输入一个网址时（在我们的例子里就是走向商店的路上时）：浏览器在域名系统服务器上找出存放网页的服务器的实际地址（找出商店的位置）。浏览器发送 HTTP 请求信息到服务器来请拷贝一份网页到客户端（你走到商店并下订单）。这条消息，包括其他所有在客户端和服务器之间传递的数据都是通过互联网使用 TCP/IP 协议传输的。服务器同意客户端的请求后，会返回一个“200 OK”信息，意味着“你可

js元素位置大小属性box.clientWidth //元素的宽度box.clientHeight //元素的高度box.offsetLeft // 元素相对父元素的左偏移box.offsetTop // 元素相对于父元素的上偏移box.offsetWidth // 元素的宽度box.offsetHeight // 元素的高度clientWidth = width+paddingcl

1、filter 此函数在ios移动端（iphone5s）失效,vue打包工具webpack也不能解决。修改为:-webkit-filter

Web Storage 是一种将少量数据存储在客户端磁盘的技术。Web Storage只允许存储字符串数据。 Web Storage有两种，一是localStorage、二是sessionStorage。检测是否支持web storageif (typeof(Storage) == "undefined") { //不支持时操作} else { //支持时的操作} 1、loca

IndexedDB是Indexed DataBase的简写，译为索引数据库。Iwindow.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;window.IDBTransaction = window.IDBTransaction || window

var Mock = require('mockjs');module.exports = function () { return { notes : Mock.mock({ 'note|20-50': [{ 'id': '@id()', 'topic': '@ctitle()', 'content': '@cparagrap

1、占位这里写链接内容

自动上传 输入框数据绑定输入框的input操作或者change,为什么不用keyup之类呢，因为keyup对于功能键依然有效。针对绑定的事件处理程序设置setTimeout，在延迟时间内再次触发该处理程序的时候清空前一次的定时器，这样避免不必要的网络请求。 二级标题 三级标题四级标题注：

验证码Node.js 的验证码确实很坑，底层本身不带有这些操作。查询了很多方法，大多都需要安装新的底层依赖，跨平台性非常低。而且涉及到一个很重要的问题，就是在部署的时候，你还得在部署的平台上再安装一次这个依赖。介于以上原因，选择了一个国人产的简单的验证码生成库 node-gd-bmp。生成验证码1、node-gd-bmp如何生成，参考 node-gd-bmp 文档。这里只是研究

占位

占位

占位

moment.jsES6import moment from 'moment';moment(Date.now()).format('HH:mm:ss');

状态码201~206201-206都表示服务器成功处理了请求的状态代码，说明网页可以正常访问。 状态码 简述 详述 200 成功 服务器已成功处理了请求。通常，这表示服务器提供了请求的网页。 201 已创建 请求成功且服务器已创建了新的资源。 202 已接受 服务器已接受了请求，但尚未对其进行处理。 203 非授权信息 服务器已成功处理了请求

查询模糊查询单字段// 查询字段 field_A 中包含 ok 的文档Model_A.find(field_A: /ok/i).exec(function(err, docs){});//或者：var regexp = new RegExp('ok', 'i');Model_A.find(field_A: regexp).exec(function(err, docs){}

前后端数据交互GET1. URL 查询字符串前端前端向后端提交请求以及参数可以通过为 url 附加查询字符串来完成的。如浏览器地址栏的内容：http://mp.blog.youkuaiyun.com/postlist/all/all/all?key=get? 之后的 key=get 部分称为查询字符串。前端通过这种方式向后端传递查询参数。axiosaxios('/use

相关库Respond CSS3 Media pollyfill，适用于 IE6~IE8，或更多html5shiv 让 Internet Explorer 6-9, Safari 4.x (and iPhone 3.x), and Firefox 3.x. 支持 html5 标签CSS3 PIE 让低版本的 IE 支持 CSS3 特性，目前支持： border-radiusbox-...

Compass在sass的基础上封装了一系列有用的模块和模板，用以补充sass的功能。更多sass1、安装Compass是用Ruby语言开发的，因此首先要安装Ruby。如何安装Rubysudo gem install compass2、创建项目进入需要创建项目的目录下，然后运行compass create mycompass此时就会在在该目录下创建一个mycompass的子目录。目录结构 . ├

1、forEach、$.each 简单地遍历js语法arrayName.forEach(function(value,index,arr){ //遍历的值，下表，数组本身 //...});jQuery写法$.each(arrayName,function(index,value,arr){ //...}); 2、map、$.map 映射，返回一个新数组，但需要显式地返回值用

工具： photoshop CC切图方式1. 普通切图直接切图工具，文件>导出>存储为web可用格式2. 自动切图文件>导出>将图层导出到文件，导出的图层每个都一个大图，跟原PSD大小相同3. 智能切图CC的功能首先要设置 首选项>增效工具>☑️启用生成器 然后文件>生成>☑️图像资源。然后保存就可以开始智能切图，会在psd的目录下生成一个assets文件夹我自己弄的时候总会生成一个错误文件，无法

选择器 例子 描述 CSS .class .intro 选择 class=”intro” 的所有元素 1 id firstname 选择 id=”firstname” 的所有元素 1 * * 选择所有元素 2 element p 选择所有 < p> 元素 1 element,element div,p 选择所

DOMContentLoaded：Dom树构建完成时间，在Dom树加载完成和资源加载之前触发。 Load：页面加载完成事件，在页面加成完成时触发。Dom加载的流程：解析HTML结构加载外部脚本和样式表文件解析并执行脚本代码Dom树构建完成 此时触发DOMContentLoaded事件加载图片等外部资源页面加载完成 此时触发Load事件

Sass/Scss区别：sass不需要{}和；而scss需要//sass:$color=red.box color:$color//scss$color:red;.box{ color=$color;}个人建议使用scss,更符合书写习惯，代码也更清晰sass需要编译成css文件然后使用编译规则有以下几种：nested：嵌套缩进的css代码expanded：展开的多行cs

javascript

js定时器操作，setTimeout clearTimeout setInterval clearInterval浏览器的js为单线程，那他是怎么处理这样的情况的呢？定时器操作是异步的，也就是浏览器有专门的线程在处理，在js代码中调用的只是浏览器中对应的线程。当浏览器的定时器线程处理完成后，将回调函数压入任务队列，等待执行。for(int i=0;i<1000;i++){ setTimeo

初学：{ Vue axios vue-resource vue-router vuex vue-router}ES6ES7HTML5CSS3Animate.css进阶：jQueryjavascriptcsshtml深入：

说明在网上找了很多Promise的介绍，最后大多都指向Promise的官方说明，官方并未对每句话给出相关的案例说明。本人天资愚钝，理解不到说明的含义，只得一句话一句话理解，难以理解之处辅以案例说明。原文参考图灵社区的【翻译】Promises/A+规范，文字部分直接拷贝。正文术语 解决（fulfill）：指一个 promise 成功时进行的一系列操作，如状态的改变、回调的执行。虽然规范中用 ful

声明：本文大部分内容属于摘录，引用原文地址如下： 说说移动前端中 viewport （视口）正文移动前端中常说的 viewport （视口）就是浏览器显示页面内容的屏幕区域。其中涉及几个重要的概念：layout viewport（布局视口）     一般移动设备的浏览器都默认设置了一个viewport 元标签，定义一个虚拟的layout viewport（布局视口），用于解决早期的页面在手机上

1、视窗单位 vs 百分比单位

1、Ajax2、Promise3、asyn4、new操作符5、存储6、页面加载

移动端开发做完pc端，再到移动端，突然一脸懵比。PC端好不容易入门了，移动端又是什么鬼？小白一脸茫然不知所措，赶紧问度娘。什么移动端开发教程啦，移动端web开发啦，搜索一大堆，然而知识零散，还是没告诉我到底区别在哪儿，需要技术有哪些。读到这里，你以为我知道了，那你就太天真了，我不过是通过写文章引导自我思考而已….接下来，按照惯例就是先解决大概念问题…十万个为什么接踵而至。1、移动端web开发是什么？

d

移动端和PC端在代码书写上有什么区别呢？下面是基础的HTML模板，使用工具自动生成的：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body></body></html>这段代码，并没有告诉我们移动端开发有什么不同，现在需要加一些东西。<

Ajax是Asynchronous Javascript and XML的缩写。它不是一门语言，只是一种开发技术，能够在不卸载页面的情况下向服务器请求数据并更新局部的Dom,比起以往Web的“单击、等待”方式用户体验得到了极大的提升。 XMLHttpRequest 是 AJAX 的基础。最初由微软引入的一个新特性。 XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加

创建正则的方式：1、构造函数创建var regExp = new RegExp('[0-9a-zA-Z]'，'gi');//创建一个只能是数字和字母的正则2、字面量方式创建var regExp = /[0-9a-zA-Z]/gi;在ECMAScript3中，正则字面量始终会共享同一个RegExp实例。 在ECMAScript5中规定，使用字面量和构造函数每一次都要都要创建一个新的RegE

1、jquery$('.navbar-nav').on('click','li',function(e){ //为滚动条添加点击事件 var target = $(this).find('a').attr('href'); //获取被点击的li下的a元素的href属性值，也就是目标元素的锚点选择器 var top = $(target).offse

作用：区分人和机器。我们经常看到的以几个汉字或者数字、字母组成的字符串，其实在客户端展示的是一张图片。因为如果使用字符串，是很容易被机器提取识别的。单独的图片上只有几个字符的话对于一些机器来讲也是很容易比对识别的，因此就需要一些干扰元素，我们最常见的干扰元素就是一些点和线。在客户端识别到字符，并输入提交的时候，服务器需要判断用户提交验证码的正确性。需要跟什么比对呢？需要跟验证码图片上的文字做比对，因

代码层面：避免使用css表达式，避免使用高级选择器，通配选择器。缓存利用：缓存Ajax，使用CDN，使用外部js和css文件以便缓存，添加Expires头，服务端配置Etag，减少DNS查找等请求数量：合并样式和脚本，使用css图片精灵，初始首屏之外的图片资源按需加载，静态资源延迟加载。请求带宽：压缩文件，开启GZIP...