08 2016 档案
摘要：向ES6看齐，用更好的JavaScript（二） 上一篇 中介绍了关于变量部分的新特性，本篇将从现有对象的拓展来展开介绍 1 增加了模板字符串 先看一下，ES6之前我们是如何实现输出模板的： document.getElementById('root').innerHTML = "the user
阅读全文
摘要：在html里，width与height是最常用也是最基础的两个属性，因此，在js里，我们也经常需要操作这两个属性。js关于这两个属性提供了client*,offset*与scroll*,很多同学搞不清楚这三者之间的区别，经常望着这三个属性满脸问号，不知道该用哪个。所以今天就来看一下这三个属相的区别。
阅读全文
摘要：在 javascript之 this 关键字详解 文章中，谈及了如下内容，做一个简单的回顾： 1.this对象的涵义就是指向当前对象中的属性和方法。 2.this指向的可变性。当在全局作用域时，this指向全局；当在某个对象中使用this时，this指向该对象；当把某个对象的方法赋值给另外一个对象时
阅读全文
摘要：js继承有5种实现方式：1、继承第一种方式：对象冒充 function Parent(username){ this.username = username; this.hello = function(){ alert(this.username); } } function Child(user
阅读全文
摘要：JS中原型链，说简单也简单。 首先明确： 函数（Function）才有prototype属性，对象（除Object）拥有__proto__。 首先，我画了一张图。 所谓原型链，指的就是图中的proto这一条指针链！ 原型链的顶层就是Object.prototype，而这个对象的是没有原型对象的。 可
阅读全文
摘要：原型链理解起来有点绕了，网上资料也是很多，每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看，效果极好。 不要纠结于那一堆术语了，那除了让你脑筋拧成麻花，真的不能帮你什么。简单粗暴点看原型链吧，想点与代码无关的事，比如人、妖以及人妖。 1）人是人他妈生的，妖是妖他妈生的。人和妖都是对象实例，而
阅读全文
摘要：回调函数 既然函数与任何被赋值给变量的数据是相同的，那么她当然可以像其他数据那样被定义、删除、拷贝，以及当成参数传递给其它函数。 我们定义一个函数，这个函数有两个函数类型的参数，然后他会分别执行这两个参数所执行的函数。 实际上，我们也可以直接用匿名函数（即函数表达式）来替代one(),two(),以
阅读全文
摘要：事件冒泡和事件捕获分别由微软和网景公司提出，这两个概念都是为了解决页面中事件流（事件发生顺序）的问题。考虑下面这段代码，就不写html->head,body之类的代码了，自行脑补 上面的代码当中一个div元素当中有一个p子元素，如果两个元素都有一个click的处理函数，那么我们怎么才能知道哪一个函数
阅读全文
摘要：Javascript是一种基于对象（object-based）的语言，你遇到的所有东西几乎都是对象。但是，它又不是一种真正的面向对象编程（OOP）语言，因为它的语法中没有class（类）。 那么，如果我们要把"属性"（property）和"方法"（method），封装成一个对象，甚至要从原型对象生成
阅读全文
摘要：ECMAScript6中新增了Promise对象， 所谓Promise对象，即代表着一个还未完成，但将来某时会完成的操作（通常是异步操作）。使用Promise对象，我们就可以避免陷入函数层层嵌套的‘回调金字塔’里去，将异步的操作以同步的的形式展现出来。Promise对象对外提供了一整套完整的接口，方
阅读全文
摘要：在平时的开发或者学习的过程中，我们难免会看到一些让人心动的网站，于是自己想把它弄下来，自己手工一个文件一个文件把它保存下来不太可能，那得累死你，下面我推荐一款扒站的神器，可以把你所喜欢的目标网站整个网站给扒下来，这个神器就是teleport ultra。下面简单介绍下使用教程。 下载与安装 首先到官
阅读全文
摘要：目的：为开发页面时有一套明确的页面结构化实施方案，提高开发效率； HTML结构化指的其实就是使用HTML语义化标签根据web标准书写具有明确结构逻辑的HTML代码的一种思路；说白了重点就是：页面实际要展现的内容，贴切页面内容的HTML标签，符合web标准，结构逻辑明确； 前置条件 1、了解HTML语
阅读全文
摘要：箭头函数（Arrow functions）,是ECMAScript2015中新加的特性，它的产生，主要有以下两个原因：一是使得函数表达式（匿名函数）有更简洁的语法，二是它拥有词法作用域的this值，也就是说它跟父作用域共享this，不会新产生自己作用域下的this, arguments, super
阅读全文
摘要：不管学习什么知识，习惯于把自己所学习的知识列成一个list，会有助于我们理清思路，是一个很好的学习方法。强烈推荐。 以下篇幅有点长，希望读者耐心阅读。 以下内容会分为如下部分： 1.涵义 1.1：this涵义 1.2：this指向的可变性 2.使用场合 2.1：全局环境 2.2：构造函数 2.3：对
阅读全文
摘要：常用命令 #下载项目$ git clone git://github.com/jquery/jquery.git#添加项目到暂存区，点号表示添加所有$ git add <filename>/.#提交暂存区到仓库区$ git commit -m [message] #或者git commit -a#推
阅读全文
摘要：前言 之前一直想一篇这样的东西，因为最初接触时，我也认真看了廖雪峰的教程，但是似乎我觉得讲得有点多，而且还是会给我带来很多多余且重复的操作负担，所以我希望能压缩一下它在我工作中的成本，但是搜索了一下并没有找到满意的教程，新的一年自己梳理一下自己的经验。 可能男生们大神比较多，觉得Git是如此简单，便
阅读全文
摘要：本文主要总结自《JavaScript 语言精粹》、部分总结自《JavaScript 高级程序设计》以及自己的经验 四种调用模式 在 JavaScript 中，this 的值取决于调用模式，有四种调用模式，分别是方法调用模式、函数调用模式、构造器调用模式、Apply、call 调用模式。 方法调用模式
阅读全文
摘要：版权声明：作者原创，转载请注明出处！ 编写插件的两种方式: 1.类级别开发插件(1%) 2.对象级别开发(99%) 类级别的静态开发就是给jquery添加静态方法，三种方式 1.添加新的全局函数 2.使用$.extend(obj) 3.使用命名空间 类级别开发插件（用的非常少，1%） 分别举例： /
阅读全文
摘要：这是一个webApp 阅读器的项目，是慕课网的老师讲授的一个实战，先给出项目源码在GitHub的地址：https://github.com/yulifromchina/MobileWebReader。 项目属于麻雀虽小，但五脏俱全的类型，对于前端新手来说，还是很有学习价值。 一、项目成果展示 二、项
阅读全文
摘要：一、注册github账号 github网址https://github.com/ 下一步 然后，你的邮箱会收到一封邮件，进行邮箱验证就行了 二、创建github仓库 登录你的github，在首页的右方可以看到下图所示（我已经创建过项目了，没有创建过项目的显示有点不一样，但是都是这个按钮） 下一步 创
阅读全文
摘要：之前没感觉要学啥单元测试，项目中测试都是手动测的，但也没觉的啥，但最近看文章和招聘上也多多少少有这方面的需求，于是网上搜索了一下，只找到了一些文章，但介绍的都不是很详细或者说比较复杂，满满的伤，虽然看懂一部分，但还是不知道有啥用，于是不了了之了。 但是就在今天又在某本书上讲啥测试，实在坐不住了，于是
阅读全文
摘要：在上次的分享中javascript--函数参数与闭包--详解，对闭包的解释不够深入。本人经过一段时间的学习，对闭包的概念又有了新的理解。于是便把学习的过程整理成文章，一是为了加深自己闭包的理解，二是给读者提供学习的途径，避免走弯路。 在javascript--函数参数与闭包--详解这篇文章中，我详细
阅读全文
摘要：如何绕过chrome的弹窗拦截机制 在chrome的安全机制里面，非用户触发的window.open方法，是会被拦截的。举个例子： var btn = $('#btn'); btn.click(function () { //不会被拦截 window.open('http://cssha.com')
阅读全文
摘要：参考链接：http://blog.csdn.net/libin_1/article/details/50879505 http://www.cnblogs.com/libin-1/p/5770699.html
阅读全文
摘要：项目中常用js方法整理成了common.js
阅读全文
摘要：阅读目录 先上原理图: 背景： 问题： 一、什么是 AJAX 二、提交Form表单的原理 三、AJAX提交请求和服务响应的原理 四、XMLHttpRequest 对象的知识 五、JQuery实现AJAX 六、优势 七、缺点 八、应用场景 九、不适用场景 阅读目录 先上原理图: 背景： 问题： 一、什
阅读全文
摘要：摘要：事件流这个东西是比较重要的，为了让自己更加理解js中的事件流，必须整理整理，梳理一下事件流的各种东西啊。本文大部分内容参考《javascript高级程序设计第三版》 先来一段书里的原文： 当浏览器发展到第四代时（IE4和Netscape Communicator 4）,浏览器团队遇到一个很有意
阅读全文
摘要：摘要：事件流这个东西是比较重要的，为了让自己更加理解js中的事件流，必须整理整理，梳理一下事件流的各种东西啊。本文大部分内容参考《javascript高级程序设计第三版》 先来一段书里的原文： 当浏览器发展到第四代时（IE4和Netscape Communicator 4）,浏览器团队遇到一个很有意
阅读全文
摘要：经常会看些性能分析的书，但是实际在做优化的时候又无从下手。 因为没有数据，也不能确定实际用户到底在哪一环影响了他们的性能。 现在H5提供了一些很方便的Performance接口，可以让我们更方便的搜集到用户的数据，不过有几个方法的兼容性实在太差。 插件已经上传到Github中，可以在这里获取到，in
阅读全文
摘要：for...in循环中的循环计数器是字符串，而不是数字它包含当前属性的名称或当前数组元素的索引，下面有个不错的示例大家可以参考下 大家都知道在JavaScript中提供了两种方式迭代对象： (1)for 循环； (2)for..in循环； 使用for循环进行迭代数组对象，想必大家都已经司空见惯了。但
阅读全文
摘要：废话不多说： 一、序 博主最近这些天，突发奇想的想研究一下CSS3的东西，从而提升一下CSS的能力，在学习的过程中发现其实CSS3是一个挺复杂的东西，深入的研究，你可能会涉及到初中的光学理论来帮助理解一些概念，同时如matrix可能还需要你用大学学习的矩阵来进行分析，因为这是本系列的第一篇文章，所以
阅读全文
摘要：1、hasOwnProperty() hasOwnProperty()函数用于指示一个对象自身(不包括原型链)是否具有指定名称的属性。如果有，返回true，否则返回false。 该方法属于Object对象，由于所有的对象都"继承"了Object的对象实例，因此几乎所有的实例对象都可以使用该方法。 I
阅读全文
摘要：HTML Markup CSS Code 上面的demo效果，明显的可以看出，在inline-block的元素之间存在“4px”的空白： 上面截图是：IE8-9、Firefox、Safari等浏览器下的效果，换句话说，这种现像只有在这几种浏览器中才会出现。下面我们就来说说解决这个“4px”(Chro
阅读全文
摘要：很久之前就看了有关JavaScript继承，都没怎么总结，刚好今天有空就来聊聊呗 (^o^)/ 通过不断试验 来检验自己理解的正确性。 首先JavaScript里面所有的数据类型都是对象（object），其中的new命令引入Javascript，用来从原型对象生成一个实例对象。 （这里请注意：在Ja
阅读全文
摘要：本文总结自《JavaScript高级程序设计》以及自己平时的经验，针对较新浏览器以及 DOM3 级事件标准（2016年8月），对少部分内容作了更正，增加了各种例子及解析。 如无特殊说明，本文后的文字引用和图片引用均来自《JavaScript高级程序设计》，引用稍有改变原文，不改变意思。 本文仅作巩固
阅读全文
摘要：原文链接：http://www.cnblogs.com/LY-leo/p/5765598.html 对于 :before 和 :after 选择器，大家并不陌生，但是很少有人会主动去用它们。先解释下它们的定义和用法： :before 选择器在被选元素的内容前面插入内容，:after 选择器在被选元素
阅读全文
摘要：一、前言大家好，我是19944号万技师，来自湖南，以手法精湛而著称，目前在TGideas兼职重构工作。最近和我们部长aiden在做一个Motion的移动端组件库，被很多客户吐槽没有使用很频繁的音频组件。 之前觉得，音频这一块功能较为简单，不需要沉淀组件。但经过一番琢磨，却做出了不少有意思的东西。比如
阅读全文
摘要：友情链接：http://www.cnblogs.com/w-wanglei/p/5763103.html 什么是hivideo？ 最近一段时间在使用PhoneGap开发一个App应用，App需要播放视频，本想直接使用html5的video，但使用它在全屏播放时不支持横屏播放，只能放弃。最终决定还是自
阅读全文
摘要：友情链接：http://www.cnblogs.com/constantince/p/5701262.html 前言 卤煮在公司之初接触到的是一个微信APP应用。前端技术采用的是Backbone+zepto等小型JS类库。在项目开发之初，这类中小型的项目采用这两种库可以满足基本的需求。然而，随着迭代
阅读全文
摘要：友情链接：http://www.htmleaf.com/Demo/201504031619.html http://www.htmleaf.com/Demo/201504191708.html 0 PgwSlideshow简介 PgwSlideshow是一款基于Jquery的图片轮播插件，基本布局分
阅读全文
摘要：git cherry-pick合并某个commit 1、使用方法及其作用 git cherry-pick可以选择某一个分支中的一个或几个commit(s)来进行操作（操作的对象是commit）。例如，假设我们有个稳定版本的分支，叫v2.0，另外还有个开发版本的分支v3.0，我们不能直接把两个分支合并
阅读全文
摘要：因为想实现相框的拖到，找了半天的原因愣是没有找到错误，所以，只能翻看源码了 如何实现拖动效果？ 浏览DEMO 首先分析下拖动效果原理： 1.当鼠标在被拖动对象上按下鼠标（触发onmousedown事件，且鼠标在对象上方） 2.开始移动鼠标（触发onmousemove事件） 3.移动时更显对象的top
阅读全文
摘要：在深入学习JavaScript之后,我们越来越多的会遇到函数或者在对象内部中,对于this的指向问题的疑惑,其实基本上每一个编程语言中都有一个this,这个this的指向都是大同小异,你也可以汉化它的意思,this的意思是这个,就是本身的意思,那么在JavaScript中,我们的this代替的那个本
阅读全文
摘要：js中的hasOwnProperty()和isPrototypeOf() 这两个属性都是Object.prototype所提供:Object.prototype.hasOwnProperty()和Object.prototype.isPropertyOf()先讲解hasOwnProperty()方法
阅读全文
摘要：$('body').on('click', '.placeholder img', function(e) { //touchstart在你之前发生，不管些什么，都先执行下面的 }); $('body').on('touchstart', '#gallerySlider img', function(e) { var touch = e.originalEv...
阅读全文
摘要：项目背景 webtouch（webapp）页面，防苹果手机safari浏览器，网上滑动，底部导航消失，滑动到底部又出现。向下滑动，底部导航出现。 遇到问题 1、我一开始用swipeup和swipedown来做，发现因为有滚动条，不会触发。因此只能判断滚动条是上滚下滚等。关于手机手势，后面的文章会介绍
阅读全文
摘要：在去年的时候也实现过合成海报的功能，不过当时时间仓促，实现的比较简单。 就一个旋转功能，图片也不能拖动放大，也不能裁剪。 去年的实现可以参考《移动图片操作--上传》和《移动图片操作--预览旋转合成》 这次有时间就实现一个功能稍微多点的海报。 一、概要 第一屏 总共有三屏，第一屏是选择图片，第二屏是合
阅读全文
摘要：前段时间做了个跟裁剪相关的活动《用H5中的Canvas等技术制作海报》，这次公司要做个与奥运相关的活动，扫车牌赢奖。 于是我就在上一个活动的基础上，将代码重新封装一下，并且将计算方式写的更通用。下图是活动中裁剪的页面： 先来看看两个活动的不同： 1、原先的活动每次旋转只能90°，而此次活动可以任意角
阅读全文
摘要：function DX(n) { if (!/^(0|[1-9]\d*)(\.\d+)?$/.test(n)) return "数据非法"; var unit = "千百拾亿千百拾万千百拾元角分", str = ""; n += "00"; var p = n.indexOf('.'); ...
阅读全文
摘要：<!DOCTYPE html .main { width: 300px; height: 300px; background: red; } .content { width: 100px; height: 100px; background: blue; } // $(function() { /
阅读全文
摘要：预解析的过程 代码的执行过程 程序在执行过程，会先将代码读取到内存中检查，会将所有的声明在此时进行标记。所谓的标记就是让js解释器直到有这个名字，后面在使用名字的时候，不会出现未定义的错误，这个标记就是提升 声明： 名字的声明，标识符的声明（变量名的提升） 名字的声明就是让我的解释器知道有这个名字
阅读全文
摘要：<!DOCTYPE html window.onload = function() { function GetURLlist(name) { var reg = new RegExp("(^|&)" + name + "=([^&] )(&|$)"); var r = window.locatio
阅读全文
摘要：人们对于this的绑定常常有两个误解，一：指向函数本身，二：指向函数作用域。这两种想法都是错的，this并不指向函数本身，也不指向函数作用域。 复制代码 function foo(){ this.count++; } foo.count = 0; for(var i = 0 ; i 显示绑定 隐式绑
阅读全文
摘要：一、变量的作用域 要懂得闭包，起首必须懂得Javascript特别的变量作用域。 变量的作用域无非就是两种：全局变量和局部变量。 Javascript说话的特别之处，就在于函数内部可以直接读取全局变量。 Js代码 var n=999; function f1（）{ alert（n）; } f1（）;
阅读全文
