
JS
文章平均质量分 71
cwzhsi
这个作者很懒,什么都没留下…
展开
-
HTML5 安全问题解析
Html5安全问题解析转载 2016-08-28 16:29:20 · 1219 阅读 · 0 评论 -
给数字每三位加一个逗号分隔符的两种方法
function formatNum(num) { var STEP = 3; var DELIMITER = ','; var str = '' + num; var arr = str.split(''); var len = arr.length; for(var i = len - STEP; i > 0; i -= STEP) { arr.splic原创 2016-08-25 12:58:26 · 14597 阅读 · 3 评论 -
高中物理学运动公式实现js动画
js动画原创 2016-08-14 21:34:34 · 5602 阅读 · 1 评论 -
canvas实现擦除动画
原理总结为就是在移动设备上将某张图片擦掉显示另一张图片,利用canvas来实现。如果是用户手动擦除,则需要监听touchmove,touchend等事件,并计算相应的坐标,利用canvas的clearRect或rect 画弧线或画线来实现。但是这会造成在androd手机上存在卡顿的现象。canvas有个globalCompositeOperation属性,这个属性的默认值是source-over原创 2016-07-16 10:38:52 · 2116 阅读 · 1 评论 -
微信jssdk总结
微信jssdk总结原创 2016-07-16 09:41:44 · 2531 阅读 · 0 评论 -
webpack&gulp集成简介
gulp webpack转载 2016-07-03 14:23:27 · 1253 阅读 · 0 评论 -
《深入浅出Node.js》迷你书笔记
nodejs转载 2016-07-02 10:13:23 · 1162 阅读 · 0 评论 -
userAgent判断客户端类型
根据userAgent判断客户端类型微信判断 function is_weixin(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger") { return true; } else { return原创 2016-06-10 10:22:17 · 3513 阅读 · 1 评论 -
前端构建工具gulp入门教程
本文假设你之前没有用过任何任务脚本(task runner)和命令行工具,一步步教你上手Gulp。不要怕,它其实很简单,我会分为五步向你介绍gulp并帮助你完成一些惊人的事情。那就直接开始吧。第一步:安装Node首先,最基本也最重要的是,我们需要搭建node环境。访问http://nodejs.org,然后点击大大的绿色的install按钮,下载完成后直接运行程序,就一切准备就绪。转载 2016-06-05 14:55:47 · 768 阅读 · 0 评论 -
微信长按识别二维码bug整理
微信长按识别二维码问题搜集与整理最近在折腾一个手机端页面长按识别二维码的问题。发现长按二维码时在ios和android手机上识别不是那么灵敏。下面整理下我对该问题的总结。原创 2016-06-05 11:33:44 · 23899 阅读 · 0 评论 -
Javascript实现树结构
树节点属性 Node data:节点值 parent :指向节点的父节点 children:指向节点的孩子节点Tree 属性与方法 _root :树的根节点 traverseDF(callback) :深度遍历 traverseBF(callback):广度遍历树的实现树节点定义: function Nod原创 2016-04-23 23:02:20 · 5254 阅读 · 0 评论 -
中断或取消 Promise 链
PromisePromise 已经成为了 JavaScript 管理异步操作的重要工具之一. 然而, 有的时候还是会很头痛:Promise // 等价于 `Promise.resolve(undefined).then`. .then(() => { // 开始. }) .then(() => { if (wantToBr转载 2016-04-12 22:16:24 · 18354 阅读 · 0 评论 -
Object新方法总结
Object总共添加以下几种新方法:Object.keys()Object.getOwnPropertyNames();Object.getPrototypeOf();Object.defineProperty();Object.defineProperties();Object.getOwnPropertyDescriptor();Object.create();Object.原创 2016-03-24 14:27:25 · 1128 阅读 · 0 评论 -
使用Chrome DevTools的Timeline和Profiles提高Web应用程序的性能
英文原文:Improving Web App Performance With the Chrome DevTools Timeline and Profiles我们都希望创建高性能的Web应用程序。由于我们的应用程序变得越来越复杂,我们可能想要支持丰富的画面以及理想的60帧/秒,这能保证我们的应用程序响应灵敏且生动流畅。知道如何衡量和提高性转载 2016-03-22 14:58:34 · 818 阅读 · 0 评论 -
MVC vs. MVP vs. MVVM
1 简介 英文原文:MVC vs. MVP vs. MVVM 三者的目的都是分离关注,使得UI更容易变换(从Winform变为Webform),使得UI更容易进行单元测试。 2 MVC/MVP 2.1 MVC 1、View接受用户的交互请求 2、View将请求转交给Controller 3、Controller操作转载 2016-03-22 13:58:46 · 1008 阅读 · 0 评论 -
数据结构与算法javascript描述(六)集合
集合(Set)是一种包含不同元素的数据结构。集合中的元素称为成员。集合的两个最重要的特性是:首先,集合中的成员是无序的;其次,集合中不允许相同成员存在。当你想要创建一个数据结构,用来保存一些独一无二的元素时,比如一段文本中用到的单词,集合就变的非常有用。集合的定义:(1)不包含任何成员的集合称为空集,全集则是包含一切可能成员的集合。(2)如果两个集合的成员完全相同,则称两个集合相等。原创 2016-03-10 17:07:11 · 760 阅读 · 0 评论 -
数据结构与算法Javascript描述(五)循环链表
循环链表和单向链表相似,节点类型都是一样的。唯一的区别是,在创建循环链表时,让其头节点的next属性指向它本身,即 head.next = head;如果你希望可以从后向前遍历链表,但是又不想付出额外代价来创建一个双向链表,那么就需要使用循环链表。从循环链表的尾节点向后移动,就等于从后向前遍历链表。修改构造函数如下:function LList() { this.head =原创 2016-03-10 16:50:30 · 623 阅读 · 0 评论 -
数据结构与算法Javascript描述(四)双向链表
尽管从链表的头节点遍历到尾节点很简单,但反过来,从后向前遍历则没那么简单。通过给Node 对象增加一个属性,该属性存储指向前驱节点的链接,这样就容易多了。此时向链表插入一个节点需要更多的工作,我们需要指出该节点正确的前驱和后继。但是在从链表中删除节点时,效率提高了,不需要再查找待删除节点的前驱节点了。 function Node(element) { this.element =原创 2016-03-10 16:38:40 · 1379 阅读 · 0 评论 -
数据结构与算法Javascript描述(三)链表
数组不总是组织数据的最佳数据结构,因为数组的长度是固定的,所以当数组已被数据填满时,要再加入新的元素就会非常困难。在数组中,添加和删除元素也很麻烦,因为需要将数组中的其他元素向前或向后平移,以反映数组刚刚进行了添加和删除操作。然而,JavaScript 的数组并不存在上述问题,因为使用split() 方法不需要再访问数组中的其他元素了。JavaScript中的数组的主要问题是,它们被实现成了对象,原创 2016-03-10 16:27:31 · 604 阅读 · 0 评论 -
数据结构与算法Javascript描述(二)队列
特点:先进先出Queue类 function Queue() { this.dataSource = []; this.enqueue = enqueue; this.dequeue = dequeue; this.front = front; this.back = back; this.empty = empty; this.toString原创 2016-03-10 15:54:49 · 451 阅读 · 0 评论 -
数据结构与算法Javascript描述(一)栈
栈的特点: 后入先出。Stack类: function Stack() { this.dataSource = []; this.top = 0; this.push = push; this.pop = pop; this.peek = peek; this.clear = clear; this.length = length原创 2016-03-10 15:34:45 · 575 阅读 · 0 评论 -
改变opacity实现图片轮播
这里实现原理我就不详细述说了,主要是通过改变图片的opacity,利用fadeIn和fadeOut来实现过渡效果,使切换不会显得很突兀。但是我在这里遇到了一个问题,让我纠结了一段时间。问题是,我发现页面初始化的时候首屏切换并没有过渡效果,仅仅是直接切换了。我想了很久,以为是我的index的初始值不对,但发现根本不是这个问题。最后,终于发现,原来是我的样式的问题,我将所有的图片都设置为displ原创 2016-02-22 14:33:47 · 2723 阅读 · 0 评论 -
手机端图片左右滑动效果实现
起初我想尝试用jQuery Mobile的swipeleft和swiperight,可以实现手势左右滑动的效果,但是jQuery Mobile对页面的其它部分影响很大,所以不得不放弃使用。接着我又尝试用zepto.js,但是由于页面很大部分已经依赖了jQuery,jQuery和zepto.js存在冲突,我本打算解决冲突,让两者共存,但是最后还是放弃了,因为觉得引入两者实在是太冗余。所以我最后采用了原创 2016-01-25 16:32:35 · 17632 阅读 · 1 评论 -
classList详解,让你的js方便地操作DOM类
在此之前,jQuery的hasClass、addClass、removeClass我们已经再熟悉不过了,然而我们并不会在每一个项目中都会去使用jQuery或者Zepto,譬如在移动端的网页中,考虑到传说中的性能和静态资源的请求量等因素,我们通常会选择采用原生js,而对于元素的class操作。你首先想到的就是className,这位伙计完美地得到了包括ie6在内的所有古现代浏览器的支持,尽管它的功能转载 2016-01-16 11:13:36 · 3403 阅读 · 0 评论 -
产品详情页配送送信息联动的实现逻辑
功能图如下:需要实现选择运送国家时,相应的运送方式随着改变,同时运送价格也改变后台返回的部分数据如下:{ "jsonrpc":"2.0", "id":null, "result":{ "delivery_info":{ "1":[//对应的country id { // co原创 2016-01-13 08:38:45 · 688 阅读 · 0 评论 -
搜索框组件
最近封装了一个search bar的组件,主要用到了Qweb的template在相关组件中来引入,相关的代码如下:search_bar_template.xml :原创 2016-01-11 09:10:33 · 1672 阅读 · 0 评论 -
HighCharts源码学习---扩展函数wrap和扩展对象 extendClass
Highcharts.wrap在原函数的基础上扩展原函数 /** * Wrap a method with extended functionality, preserving the original function * @param {Object} obj The context object that the method belongs to * @p原创 2015-12-27 14:24:25 · 1236 阅读 · 0 评论 -
购物车实现逻辑
购物车页面如下:购物车表cart_line主要存储了如下的几个字段(还包括一些其它的字段) id count :产品的数量 product_product_id :产品id product_hot_item_id : res_partner_id:用户id1. 点击加入购物车时,向后台发请求,后台根据前台传递的参数从数据库对应的表中读取相应的信息,然后 插入到ca原创 2015-12-25 16:22:02 · 17081 阅读 · 2 评论 -
关于form表单button事件教训
在form中我自定义了一个button,然后在button上增加了点击事件。html代码大致如下: 下载图片原创 2015-12-09 11:41:27 · 5178 阅读 · 0 评论 -
Object.defineProperty
Object.defineProperty方法 方法原型 Object.defineProperty 提供一种直接的方式来定义对象属性或者修改已有对象属性,方法原型如下: Object.defineProperty(obj,prop,descriptor) 参数 obj:必须,要在其上添加或修改属性的对象。 prop:必须,待修改的属性名称原创 2015-12-07 10:50:44 · 527 阅读 · 0 评论 -
JavaScript跨域总结与解决办法
什么是跨域1、document.domain+iframe的设置2、动态创建script3、利用iframe和location.hash4、window.name实现的跨域数据传输5、使用HTML5 postMessage6、利用flash本文来自网络(http://f2e.me/200904/cross-scripting/,该网址已不能访问),仅作个人读书笔记之用,并稍作修改和转载 2015-11-05 09:41:42 · 358 阅读 · 0 评论 -
localstorage sessionstorage cookie的区别
一、基本概念Cookiecookie比较小,大小限制在4kb左右,是网景公司的前雇员 LouMontulli 在1993年3月的发明。它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记住密码”,这通常就是通过在 Cookie 中存入一段辨别用户身份的数据来实现的。 localStoragelocalStorage 是 HTML5 标准中新加入的技术,它并不是什么划时代新东西。早在 IE原创 2015-11-01 14:03:52 · 2561 阅读 · 0 评论 -
http中get和post的区别
Http中Get和Post的区别1 get和post的原理区别(1)根据Http规范,GET用于信息获取,是安全和幂等的,获取的内容可以被浏览器缓存。 语义上,GET是获取指定URL上的资源,是读操作,重要的一点是不论对某个资源GET多少次,它的状态是不会改变的,在这个意义上,我们说GET是安全的(这里的安全的含义仅仅是指不修改信息,不是被密码学或者数据保护意义上的安全)。因为G原创 2015-10-22 22:29:36 · 667 阅读 · 0 评论 -
jQuery.Deferred(func)总结
Deferred异步队列的总结:jQuery.Deferred(func) {(1)创建成功、失败、消息回调函数列表,设置初始状态为pendingvar doneList = jQuery.Callbacks('once memory'), failList = jQuery.Callbacks('once memory'), progressList = jQ原创 2015-09-20 16:28:40 · 733 阅读 · 0 评论 -
jQuery.Callbacks之demo
jQuery.Callbacks是jquery在1.7版本之后加入的,是从1.6版中的_Deferred对象中抽离的,主要用来进行函数队列的add、remove、fire、lock等操作,并提供once、memory、unique、stopOnFalse四个option进行一些特殊的控制,这是jquery的官方文档:http://api.jquery.com/jQuery.Callbacks/转载 2015-09-19 19:49:50 · 362 阅读 · 0 评论 -
javascript组件化
作为一名前端工程师,写组件的能力至关重要。虽然javascript经常被人嘲笑是个小玩具,但是在一代代大牛的前仆后继的努力下,渐渐的也摸索了一套组件的编写方式。下面我们来谈谈,在现有的知识体系下,如何很好的写组件。比如我们要实现这样一个组件,就是一个输入框里面字数的计数。这个应该是个很简单的需求。我们来看看,下面的各种写法。为了更清楚的演示,下面全部使用jQuery作为基础转载 2015-09-03 21:36:25 · 1298 阅读 · 0 评论 -
模拟淘宝侧边服务模块鼠标悬停效果的三种实现方式总结
淘宝侧边服务模块图如下: 当我们把鼠标移到充话费这个模块上时,上面的图标会有一个快速的向上移动然后又回到原来位置的过程。 仔细观察后,可以将这个动画过程分解为三步:图片向上移出并消失:这一步主要是靠改变top属性的值和opacity来实现。图片将top设置为一个固定值,这个值将会作为为下一步动画执行时的初始值:这一步只需改变top值。图片回归到原来的位置并显示:改变top和opacit原创 2015-08-30 20:12:18 · 1677 阅读 · 0 评论 -
js时间戳与日期格式之间的转换
将时间戳转换为日期格式var date = new Date(时间戳);获取一个时间对象。下面是获取时间日期的方法下面是获取时间日期的方法。date.getFullYear();//获取完整的年份(4位,1970)date.getMonth();//获取月份(0-11,0代表1月,用的时候记得加上1)date.getDate();//获取日(1-31)date.getTime();//获原创 2015-08-24 09:08:28 · 5143 阅读 · 0 评论 -
typeof
typeof操作符返回一个字符串,表示未经求值的操作数(unevaluated operand)的类型。 typeof 可能的返回值如下:null 注意这个特殊的 typeof null === object.常见的面试题中涉及到typeof题目一(function(){ return typeof arguments; })();返回值为:object arguments是对象原创 2015-08-20 12:24:54 · 2843 阅读 · 0 评论 -
jQuery的deferred对象详解
jQuery的deferred对象详解一、什么是deferred对象?开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异步的操作(比如ajax读取服务器数据),也有同步的操作(比如遍历一个大型数组),它们都不是立即能得到结果的。通常的做法是,为它们指定回调函数(callback)。即事先规定,一旦它们运行结束,应该调用哪些函数。但是,转载 2015-08-20 09:41:19 · 326 阅读 · 0 评论