2017年05月_Generon

原创 js开发： JavaScript 中的面向对象的初步理解

我在学习JS的面向对象编程的时候，总是有两个奇怪的问题。第一个就是：面向对象在JS中很少用到。。。可能是目前自己做的项目还是比较简单，前端方面的任务我几乎都是用面向过程的方式写的，所以就导致，我啃了那么久的书，代码也跟着书上的例子敲了，但好像一点收获也没有，还是不知道JS的面向对象有什么用。当然，我知道是自己目光短浅。。因为JS可是像个单身很久的家伙一样一直强调“万物皆对象

2017-05-31 23:54:20 422

原创 http协议:http协议理解

HTTP协议定义超文本传输语言工作原理1.客户端与服务器建立链接,2.并向服务器发送请求(点击http连接),携带信息有URL 协议版本号其他内容3.服务器接收到请求后给予响应信息,其中包括请求行协议版本号响应码服务器信息和实体信息4.客户端收到服务端信息并将信息显示出来请求信息的组成部分请求行请求的第一行,有三部分构成

2017-05-31 23:35:23 967

原创 jquery开发：jquery插件编写类型

jQuery插件类型jQuery插件主要分为3种类型： 1.封装对象方法的插件(对象级别组件开发) 这种插件是将对象方法封装起来，用于对通过选择器获取的jQuery对象进行操作，是最常见的一种插件。这类插件可以发挥出jQuery选择器的强大优势。即挂在jQuery原型下的方法，这样通过选择器获取的jQuery对象实例也能共享该方法，也称为动态方法(实例方法)$.fn.my

2017-05-31 21:44:31 592

原创 jquery开发：jquery插件的编写

一、jQuery的插件机制为了方便用户创建插件，jquery提供了jQuery.extend()和jQuery.fn.extend()方法。1. jQuery.extend() 方法有一个重载。　 jQuery.extend(object) ,一个参数的用于扩展jQuery类本身，也就是用来在jQuery类/命名空间上增加新函数，或者叫静态方法，例如jQuery内置的 aj

2017-05-31 21:36:18 457

原创 H5开发：常见H5开发兼容问题

1、安卓浏览器看背景图片，有些设备会模糊。用同等比例的图片在PC机上很清楚，但是手机上很模糊，原因是什么呢？经过研究，是devicePixelRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone 4的960640分辨率，在网页里只显示了480320，这样devicePixelRatio＝2。现在android比较乱，有1.5的，有2的也

2017-05-25 19:49:40 8511

原创 ajax开发：ajax详解

$.ajax()1.url: 要求为String类型的参数，（默认为当前页地址）发送请求的地址。2.type: 要求为String类型的参数，请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。3.timeout: 要求为Number类型的参数，设置请求超时时间（毫秒）。此设置将

2017-05-23 11:19:19 493

原创 ajax开发： ajax的基础问题

什么是ajax：AJAX是“Asynchronous JavaScript and XML”的缩写。他是指一种创建交互式网页应用的网页开发技术。 Ajax包含下列技术：基于web标准（standards-basedpresentation）XHTML+CSS的表示；使用 DOM（Document ObjectModel）进行动态显示及交互；使用 XML 和 XSLT

2017-05-23 11:17:37 461

原创 MUi开发： mui.post学习心得、php做后端和跨域的解决办法

正题，先来看看什么是mui.post吧，mui团队对mui.post的解释mui.post()方法是对mui.ajax()的一个简化方法，直接使用POST请求方式向服务器发送数据、且不处理timeout和异常（若需处理异常及超时，请使用mui.ajax()方法），使用方法： mui.post(url[,data][,success][,dataType])，如上登录鉴权

2017-05-23 11:14:18 1936

原创 react源码分析

原文地址：http://www.html-js.com/article/JS-analysis-of-the-single-row-from-zero-reactjs-source-first-rendering-principle%203154前端的发展特别快，经历过jQuery一统天下的工具库时代后，现在各种框架又开始百家争鸣了。angular，ember，backbone，vue，a

2017-05-23 11:03:41 2430

原创 angular源码分析

AngularJS 源码分析1AngularJS简介angularjs 是google出品的一款MVVM前端框架,包含一个精简的类jquery库,创新的开发了以指令的方式来组件化前端开发,可以去它的官网看看,请戳这里再贴上一个本文源码分析对应的angularjs源码合并版本1.2.4，精简版的，除掉了所有的注释, 请戳这里从启动开始说起定位到

2017-05-23 11:01:49 2208 1

原创 ionic之切换开关，具体解决方案

1、实例背景 ionic切换开关toggle，设置样式用的是toggle-calm、toggle-light等2、实现源码[html] view plain copy print?> html> head> meta charset="UTF-8"> meta

2017-05-23 10:44:21 1158

原创 ionic+angularjs，iphone手机页面滑动出现空白页面

在开发ionic的页面时，在iphone手机上使用时，屏幕的上下滑动经常会出现白屏（页面空白）。经分析得出出现这种情况的原因：1、在标签中设置了属性overflow-scroll="true"2、页面中所有元素在渲染后的高度没有超出允许展示的高度（不会出现滚动条）去掉属性overflow-scroll="true"，即使用ionic原生滚动，不管页面中所有元素在渲染后的高度是否超出

2017-05-23 10:42:39 3031

原创 ionic-scroll,页面难以上下滑动的解决方案

混合app开发使用ionic框架的指令能够方便地实现水平滚动和垂直滑动。比如我们想实现一个能够水平滑动的画廊，可以使用下面这段代码。[html] view plain copyhtml> head> meta http-equiv="Content-Type" content="text/html; charset=utf-8

2017-05-23 10:41:25 6000

原创 ionic在mac上的环境搭建与模拟测试

ionic 在mac上的环境搭建以及在iOS模拟器上测试1.下载并安装nodejs ,这个不用多说，直接装就行了2. npm install -g cordova ionic //(安装 ionic以及cordova, 不成功就用 sudo npm install -g cordova ionic ；sudo 用于提升权限）时间可能较长，请耐心等待3 直接命令行：ionic -v 或

2017-05-22 09:01:14 1227 1

原创 es6开发：ES6学习笔记

1.let命令1）let和var的区别：let声明的变量只有所在的代码块有效。2）没有变量的提升，一定要声明后使用。使用let命令声明变量之前，该变量都是不可用的。形成“暂时性死区”。3）typeof 不再是一个百分之百安全的操作。2.块级作用域1）es5和es6比较：es5 只有全局作用域和函数作用域，没有块级作用域。2）let实际上为javasc

2017-05-18 18:54:19 626

原创 vue源码分析：渲染篇

一、前言Vue.js框架是目前比较火的MVVM框架之一，简单易上手的学习曲线，友好的官方文档，配套的构建工具，让Vue.js在2016大放异彩，大有赶超React之势。前不久Vue.js 2.0正式版已出，在体积优化（相比1.0减少了50%）、性能提升（相比1.0提升60%）、API优化等各方面都更上一层楼；本文是系列文章，主要想通过对于Vue.js 2.0源码的分析，从代码层

2017-05-18 18:35:35 9410 1

原创 vue开发：移动端图片上传

因为最近遇到个移动端上传头像的需求，上传到后台的数据是base64位，其中为了提高用户体验，把比较大的图片用canvas进行压缩之后再进行上传。在移动端调用拍照功能时，会发生图片旋转，为了解决这个问题引入了exif去判断拍照时的信息再去处理图片，这是个很好的插件。关于exif.js可以去他的GitHub上了解，这边直接npm install exif-js --save 安装，然后impo

2017-05-18 17:44:08 10525 7

原创 vue开发：生成token保存在客户端localStorage中

前面我们已经了解了可以通过localStorage在客户端(浏览器)保存数据。回顾token框架中的RESTful api快速领悟(中):token认证框架中的RESTful api快速领悟(下):token的设置我们后端有这样一个接口：http://localhost/yiiserver/web/index.php/token?client_appid=aaa&

2017-05-18 16:08:13 38460 2

原创 ajax开发：在ajax请求后台时在请求标头RequestHeader加token

情景：为了保证系统数据的安全性，一般前后台之间的数据访问会有授权与验证，这里的Token机制相对于Cookie支持跨域访问，在RESTful API里面，验证一般可以使用POST请求来通过验证，使服务端发送带有token的响应。或者，使用GET请求，这需要参数提供凭证（指URL），或者请求头里带有token。此处为上述的第二种方法：在ajax请求的标头中加Token1 var st

2017-05-18 15:57:10 1835

原创 WEB安全：centos安装apache

一、描述CentOS安装Apache服务可以有两种方式，一种是用yum安装，一种是从官网下载源代码进行安装。二、使用yum安装Apache服务步骤1：在命令行输入如下语句可以使用yum在线更新方式进行安装：[tong@tong /]$ sudo yum install httpd -y 注意：采用该方式进行安装配置文件的默认路径为：/etc/ht

2017-05-18 12:32:36 513

原创 H5开发：搭建 AngularJS+Ionic+Cordova 开发环境

目前的手机APP有三类：原生APP，WebAPP，HybridApp；HybridApp结合了前两类APP各自的优点，越来越流行。Cordova就是一个中间件，让我们把WebAPP打包成HybridAPP，并且它提供了非常多的插件，方便我们使用原生APP的功能。Ionic是一个界面样式库，仿照原生的ios和android界面；同时它是基于 AngularJs 的。本文我们在

2017-05-18 12:13:53 2321

原创 h5开发：IOS开发与H5混合开发常见的坑

最近做 iOS H5 项目，需要针对 iOS 的 webView 做适配，发现几个非常恶心的 bug。因为现在据统计 iOS7 的占比超过80%，所以适配主要针对 iOS7，但是 iOS7 不同版本缺有不同的 bug，真是让人蛋疼。iOS 7.0 input 元素聚焦问题bug 演示bug 分析点击屏幕下方的input元素，且该元素在键盘弹起的区域内

2017-05-18 12:07:44 3705

原创 H5开发：UI问题汇总

Meta基础知识：H5页面窗口自动调整到设备宽度，并禁止用户缩放页面//一、HTML页面结构 // width 设置viewport宽度，为一个正整数，或字符串‘device-width’ // height 设置viewport高度，一般设置了宽度，会自动解析出高度，可以不用设置 // initial-scale 默认缩放

2017-05-18 12:01:21 844

原创 js开发：数组的push()、pop()、shift()和unshift()

JavaScript是一种弱类型语言，不像其它程序语言需要严格定义数据类型。在JavaScript中数组可以任意修改变动，这样也就出现了一个问题，如果边遍历数组边操作数组（比如删除当前项，则所有之后的数组元素下标都将向前移动）是一件很危险的事情。JavaScript的数组是一个拥有堆栈和队列自身优点的global对象。也就是说JavaScript数组可以表现的像栈(LIFO)和队列(FIF

2017-05-18 11:49:57 98623 3

原创 css3开发：rem与px的换算

rem是相对于根元素，这样就意味着，我们只需要在根元素确定一个参考值，这个参考值设置为多少，完全可以根据您自己的需求来定。我们知道，浏览器默认的字号16px，来看一些px单位与rem之间的转换关系：| px | rem |------------------------| 12 | 12/16 = .75 || 14 | 14/16 = .87

2017-05-18 11:42:08 969

原创 css3开发：px em rem详解

概念介绍：1、px (pixel，像素)：是一个虚拟长度单位，是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI(Dots Per Inch，每英寸像素数)，在扫描打印时一般都有DPI可选。Windows系统默认是96dpi，Apple系统默认是72dpi。2、em(相对长度单位，相对于当前对象内文本的字体尺寸)：是一个相对长度单位，最初是指字母M的宽度

2017-05-18 11:39:44 500

原创 js开发：原生js实现图片延迟加载

js实现图片延迟加载方法一：?1234567891011121314151617181920212223242526272829

2017-05-18 11:21:28 687

原创 js开发：正则实例详解

正则表达式中的特殊字符字符含意\ 做为转意，即通常在"\"后面的字符不按原来意义解释，如/b/匹配字符"b"，当b前面加了反斜杆后/\b/，转意为匹配一个单词的边界。 -或- 对正则表达式功能字符的还原，如"*"匹配它前面元字符0次或多次，/a*/将匹配a,aa,aaa，加了"\"后，/a\*/将只匹配"a*"。 ^ 匹配一个输入或一行的开头，/^a/匹配"an

2017-05-18 11:05:25 709

原创 ajax开发：跨域问题解决方案

一、什么是跨域我们先回顾一下域名地址的组成：http:// www . google : 8080 / script/jquery.js　　　　 http:// （协议号） www （子域名） google （主域名） 8080 （端口号）script/jqu

2017-05-18 11:02:49 1380

原创 zepto：源码分析

/* Zepto v1.0-1-ga3cab6c - polyfill zepto detect event ajax form fx - zeptojs.com/license */;(function(undefined) { if (String.prototype.trim === undefined) // fix for iOS 3.2 String.prototype.tr

2017-05-18 10:30:34 743

原创 WEB安全：web代码安全问题总结

web代码安全问题总结一，数据库安全性1， MSSQL数据库安全性l web中不允许使用sa级的用户连接数据库解决方法：删除sa用户，新建一个权限为sa的用户，用户名和密码一样要复杂。以防暴力破解。新建一个web连接用户，去掉所有服务器角色，在用户映射中加入此用户要操作的数据库和db_public身份。如果需要其它操作要另加权限（如只加inse

2017-05-18 10:19:53 774

原创 H5开发：详说 Cookie, LocalStorage 与 SessionStorage

基本概念CookieCookie 是小甜饼的意思。顾名思义，cookie 确实非常小，它的大小限制为4KB左右，是网景公司的前雇员 Lou Montulli 在1993年3月的发明。它的主要用途有保存登录信息，比如你登录某个网站市场可以看到“记住密码”，这通常就是通过在 Cookie 中存入一段辨别用户身份的数据来实现的。localStorageloca

2017-05-18 10:14:56 1727

转载 css3开发：flexbox布局实例分析

上一篇文章介绍了Flex布局的语法，今天介绍常见布局的Flex写法。你会看到，不管是什么布局，Flex往往都可以几行命令搞定。我只列出代码，详细的语法解释请查阅《Flex布局教程：语法篇》。我的主要参考资料是Landon Schropp的文章和Solved by Flexbox。一、骰子的布局骰子的一面，最多可以放置9个点。下面，就来看看

2017-05-18 10:09:48 973

原创 H5开发：论click tap touch三者的区别

移动端用tap时会有穿透问题一：click与tap比较click与tap都会触发点击事件，但是在手机web端，click会有200-300ms的延迟，所以一般用tap代替click作为点击事件。singleTap 和doubleTap分别代表单次点击和双次点击二：tap的穿透处理使用zepto框架的tap的点击事件，来规避click事件的延迟响应，会出现穿透，即点击会触发非

2017-05-18 09:56:43 7580

原创 ajax开发：在ajax请求后台时在请求标头RequestHeader加token

情景：为了保证系统数据的安全性，一般前后台之间的数据访问会有授权与验证，这里的Token机制相对于Cookie支持跨域访问，在RESTful API里面，验证一般可以使用POST请求来通过验证，使服务端发送带有token的响应。或者，使用GET请求，这需要参数提供凭证（指URL），或者请求头里带有token。此处为上述的第二种方法：在ajax请求的标头中加Token1 var st

2017-05-18 09:53:03 8822 4

原创 ajax开发：基于 Token 的身份验证

最近了解下基于 Token 的身份验证，跟大伙分享下。很多大型网站也都在用，比如 Facebook，Twitter，Google+，Github 等等，比起传统的身份验证方法，Token 扩展性更强，也更安全点，非常适合用在 Web 应用或者移动应用上。Token 的中文有人翻译成 “令牌”，我觉得挺好，意思就是，你拿着这个令牌，才能过一些关卡。传统身份验证的方法HTTP 是一种没

2017-05-18 09:48:20 5672 1

原创 ajax开发：Promise解决多个异步Ajax请求导致的代码嵌套问题

前端小同学在做页面的时候，犯了个常见的错误：把多个Ajax请求顺序着写下来了，而后面的请求，对前面请求的返回结果，是有依赖的。如下面的代码所示：?12345678910111213141516171819

2017-05-18 09:44:44 3764

原创 js开发：正则控制输入银行卡

//js正则实现用户输入银行卡号的控制及格式化function formatBankNo (BankNo){ if (BankNo.value == "") return; var account = new String (BankNo.value); account = account.substring(0,22); /*帐号的总数, 包括空格在内 */

2017-05-17 22:28:26 2980

原创 H5开发：sessionStorage和localStorage

html5中的Web Storage包括了两种存储方式：sessionStorage和localStorage。sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。而localStorage用于持久化的本地存

2017-05-17 22:22:09 450

原创 git入门

一：Git是什么？ Git是目前世界上最先进的分布式版本控制系统。二：SVN与Git的最主要的区别？ SVN是集中式版本控制系统，版本库是集中放在中央服务器的，而干活的时候，用的都是自己的电脑，所以首先要从中央服务器哪里得到最新的版本，然后干活，干完后，需要把自己做完的活推送到中央服务器。集中式版本控制系统是必须联网才能工作，如果在局域网还可以，带宽够

2017-05-17 21:39:02 325

空空如也

空空如也