StoneIT_ZL-CSDN博客

原创 mock2easy -- 接近真实的前端mock工具

mock2easy可解决前后端分离之后的接口模拟问题，并可以自动生成接口文档，减少前后端沟通困难var path = require('path');var fs = require('fs');var open = require( 'open' );// 创建多层目录function mkdirsSync(dirname) { if (fs.existsSync(dirname

2017-11-16 10:49:25 3264

原创 Http服务器--使用Http服务做转发

使用Http服务器解决前后端联调中的跨域问题var http = require('http');http.createServer(function (req, res) { res.setHeader('Access-Control-Allow-Origin', '*'); // 设置请求头允许所有域名访问解决跨域 var options = { hostna

2017-11-16 10:20:08 3646

原创 nrm -- npm镜像源管理工具

安装npm install -g nrm基本命令-V ------------------ nrm版本信息ls ------------------ 列出所有可用镜像current ------------- 当前所使用的镜像use <registry> ------ 切换使用的镜像 registry指镜像的名称add <registry> <url> - 添加镜像del <reg

2017-11-15 19:08:46 842

原创 css3-transform

使用CSS3的transform属性实现立方体<body> <div id="box"> <div class="plane1">1</div> <div class="plane2">2</div> <div class="plane3">3</div> <div class="plane4">4</div>

2017-09-19 21:44:33 530

原创移动端密码及验证码输入框

解决问题：多个input框连续输入iOS键盘隐藏问题在ios由于focus事件默认被禁止，对于密码或验证码输入框，如果使用多个input框，每输入以为都会使键盘隐藏，输入下一位需要重新点击 input 框调出键盘，造成很不好的体验以下的方式仅提供的是四位短信验证码的解决方案，密码输入解决方案类似，可在其基础上改造；解决方式是使用一个input框，在其上放置四个span，使输入的值显示在span中

2017-09-12 15:39:14 3691

原创 flex布局

html片段<div id="wrap"> <div id="header">头部</div> <div id="content">主体部分</div> <div id="footer">底部</div></div>css片段#wrap{ display: flex; flex-flow: column nowrap; /** * f

2017-09-11 16:25:36 409

原创 window.open()被拦截问题

当浏览器检测到非用户操作（即非click等事件）跳转页面或弹出新窗口时会被有些浏览器拦截；解决办法：当只需在本页面跳转时使用window.location.href = ‘url’ 代替 window.open(‘url’); window.location仅支持本站地址的跳转；使用a标签代替（不适合放在ajax请求的回调函数中）function newOpenWin(url, id){

2017-09-08 15:13:02 1208

jsonp原理通过动态创建标签，利用script标签的src属性能够引入外部脚本的特性，动态引入一段js代码；相当于前端给服务端一个jsonp访问的标记，服务端返回一个可执行的callback函数，该函数的参数就为所请求的数据。使用jsonp的场景与条件使用场景：需要跨域访问获取数据，并且安全性要求不是很高使用条件：服务端需要提供jsonp访问的接口jsonp访问的简单封装var JSONP = f

2017-09-08 14:38:17 250

原创 AJAX

ajax请求的过程0: 请求未初始化（还没有调用 open() ）1: 请求已经建立，但是还没有发送（还没有调用 send()）2: 请求已发送，正在处理中（通常现在可以从响应中获取内容头）3: 请求在处理中，通常响应中已经有部分数据是可用的了，但是服务器还没有完成响应的生成4: 响应已完成，可以获取并使用服务器的响应了原生ajax简单封装/** 传参规则： * ajax({

2017-09-08 10:25:42 275

原创 rem单位适配

(function (doc, win) { var docEl = doc.documentElement, resizeEvt = "orientationchange" in window ? "orientationchange" : "resize", recalc = function () { var clientWidt

2017-08-26 16:38:23 330

原创闭包和面向对象设计

对象以方法的形式包含了过程，而闭包则是在过程中以环境的形式包含了数据。通常用面向对象思想能实现的功能，用闭包也能实现。如下这段闭包相关的代码：var extent = function(){ var value = 0; return { call: function(){ value++; console.log( v

2017-08-26 14:26:47 351

原创闭包

闭包，简单概括为函数的嵌套，闭包的形成与变量的作用域以及变量的生存周期密切相关。变量的作用域：变量的作用域分为全局作用域和函数作用域，在函数内部定义变量是如果使用var关键字定义则该变量作用域为函数内部，否则为全局作用域。变变量的生存周期：全局变量的生存周期是永久的，除非我们手动清除，而对于函数内部所定义的局部变量在函数退出时就会自动销毁闭包的作用：封装变量闭包可以把一些不需要暴

2017-08-26 11:34:40 251

原创 new 作用

先来一段代码function Fn(name){ this.name = name; console.log(this); console.log(this.name);}var obj = new Fn("a");// 分别输出 Fn avar fn = Fn("b");// 分别输出 window b使用new操作符时整个过程包括了5个步骤： 1.

2017-08-26 09:25:26 428

原创使用Object对象的toString()方法自定义判断数据类型方法

Object.prototype.toString方法返回对象的类型字符串Object.prototype.toString.call(2) // "[object Number]"Object.prototype.toString.call("") // "[object String]"Object.prototype.toString.call(true) // "[ob

2017-08-25 17:29:07 1507

原创 cookie设置、获取、删除

var cookie={ set: function(name, value, expires, path, domain){ if(!expires){ expires = -1; } if(!path){ path = "/"; } var d = "" + n

2017-08-24 15:16:42 308

原创使用原生方法获取地址栏参数

var getUrlParam = function(name){ var reg=new RegExp("(^|&)"+name+"=([^&]*)(&|$)"), r = window.location.search.substr(1).match(reg); console.log(window.location.search) if (r!=null)

2017-08-24 15:15:02 528

原创经典三栏布局

采用浮动的方式<!DOCTYPE><html> <head> <meta charset="utf-8"> <title>三栏布局</title> <style> *{ padding: 0; margin: 0; }

2017-08-24 10:06:52 337 1

原创 gulp使用

var gulp = require('gulp'), babel = require('gulp-babel'), // 编译ES6插件 less = require('gulp-less'), // 编译less插件 cssmin = require('gulp-minify-css'), // 压缩css插件 autoprefixer =

2017-08-24 10:02:49 249

原创 1px（1像素）边框问题

1px（1像素）边框问题.box{ position: relative; border: none;}.box:after{ // 单边框 content: ''; position: absolute; bottom: 0; background: #DCDCDC; width: 100%; height: 1px;

2017-08-23 19:14:00 605

StoneIT_ZL的博客