摘要: 支持es5.1的新浏览器function上增加了一个name属性,这样调试的时候就很容易追踪到具体调用当前方法的函数。function a(){ console.log(arguments.callee.caller.name );//b}function b(){ a();}b();chrome 21,firefox 13,opera 11.64本人亲测可用 阅读全文
posted @ 2012-06-04 00:30 小玉西瓜 阅读(482) 评论(2) 推荐(0) 编辑
摘要: 如果要做交换两个变量的值,有不想使用中间量。我采用了处理函数arguments属性的方法function exchange(a,b){ var args=arguments; args=[].slice.call(args).reverse(); a=args[0],b=args[1]; console.log(a+' '+b);//10,1};exchange(1,10);如果是firefox这样支持ECMA6语法的浏览器还可以变的更短,使用结构赋值可以大大减少代码量;function exchange(a,b){ [a,b]=[].slice.call(arg... 阅读全文
posted @ 2012-06-03 01:48 小玉西瓜 阅读(1666) 评论(8) 推荐(2) 编辑
摘要: 可能有人看到这个标题就嘿嘿一笑,JSON我还不知道么!虽然我们经常使用JSON,但是很多人还是容易混淆Javascript Object和JSONJSON,是一种是一种轻量级的数据交换格式,他的全名是JavaScript Object Notation(JavaScript对象表示法),属于ES3标准的一个子集。由于JSON的易用性,现在流行与各个领域出现了各种变体。在我们熟知的AJAX中,X所代表的XML基本已经被JSON代替。由于跨浏览器获取跨域数据JSONP也是非常好的一种解决方案。WEB开发中基本免不了要与JSON打交道。现实中很多人分不清楚什么是javascript object 什 阅读全文
posted @ 2012-06-01 18:38 小玉西瓜 阅读(2094) 评论(1) 推荐(5) 编辑
摘要: html5改进最大的是form表单控件拾色器作为其中一种已经被opera 和chrome21支持了,但是UI非常不尽人意。而且比较多的旧浏览器还是需要这个功能的。所以自己就做了这样一个控件,控件原型主要来自著名的web开发软件dreamweaver的web安全色拾色器。html的拾色器<input type="color" />色彩生成算法来自【蜃楼寻梦】特别感谢。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ 阅读全文
posted @ 2012-05-31 13:23 小玉西瓜 阅读(1561) 评论(0) 推荐(3) 编辑
摘要: 目前有很多css属性都是私有方式实现的,想用就要加一堆破前缀,-moz-,-ms-,-o-,-webkit-;如果在样式表里改一个值就需要从新把所由的都改一遍非常麻烦。或者用dom style去设置一个元素的style也非常麻烦,大部分都是驼峰式的,firefox是个另类,MozTransition要处理成这样的,不管用正则还是别的方式都不是很好处理。小的简单封装了一个方法,用起来还不错。用dom style的cssText直接注入或者,调用后拷贝到样式表都比较方便。fixCSS('transition','all .8s ease-in 1s');functi 阅读全文
posted @ 2012-05-27 20:58 小玉西瓜 阅读(1719) 评论(3) 推荐(1) 编辑
摘要: 还在终端敲命令,定位到文件夹然后node xxx.js? 你out了。现在我们有更好的调试nodejs方式为什么不去使用呢,只需要一个快捷键而已。ws本身对nodejs有良好的支持,利用ws开发调试nodejs生活将变得很轻松。1.安装nodejs,nodejs已经提供了各平台的编译过的文件不用辛苦编译了,下载安装对应自己平台的版本。http://nodejs.org/2.安装javascript神器webstorm,webstorm也是一个好软件,支持多平台。特别提醒ws是是一个商业收费软件,可以试用30天。http://www.jetbrains.com/webstorm/3.打开ws.. 阅读全文
posted @ 2012-04-29 10:27 小玉西瓜 阅读(37676) 评论(6) 推荐(4) 编辑
摘要: 1.跨浏览器,主流浏览器都可以运行2.纯javascript开发。3.配置实用方便。4.二次开发简单,易用。传送门 在线试玩成品预览 用一张图片用坐标的方式生成拼图单元格,类似css sprite。大致思路是,每个单元格有对应的两个索引,由数据驱动显示。创建实例时吧0-9乱序排列,每个单元格对应两个索引,一个是真实所在位置的索引,一个是记录现在位置的索引。拖动图片的时调整记录现在位置的索引,去对比原始数组如果值相等,那么就可以确定拼图完成。1.乱序排列[0-9]的数组生成一个新数组,来产生拼图单元格的排序。为了避免生成不符合需求的数组,比较然后递归。indicator.fn.unordere. 阅读全文
posted @ 2012-04-28 15:55 小玉西瓜 阅读(3440) 评论(0) 推荐(4) 编辑
摘要: children是个好属性,通过这个属性取得的节点不饱和文本节点,如果使用childNodes的话会包括文本节点。这个属性首先有ie进入,现在已经跨浏览器。使用他可以减少我们过滤节点的操作。兼容情况见http://www.quirksmode.org/dom/w3c_core.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html x 阅读全文
posted @ 2012-03-26 13:56 小玉西瓜 阅读(383) 评论(0) 推荐(0) 编辑
摘要: javascript 设计模式大神原创http://dustindiaz.com/smallest-domready-everfunction r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()} 我改造了一下function ready(fn){var delay;/complete/.test(document.readyState)?delay=setTimeout(function(){arguments.callee.apply(null,arguments)},9):del 阅读全文
posted @ 2012-03-16 13:24 小玉西瓜 阅读(501) 评论(0) 推荐(1) 编辑
摘要: 随着firefox11的发布这个技术壁垒已经被打破。 可能大家对innerHTML非常熟悉,outerHTML还有点眼生。这一组4个方法都是由微软发明的,自ie4.0起纳入html DOM,后面各浏览器厂商陆续提供了支持。但是由于firefox不支持所以还不能直接使用。以至于出现了各种版本如修改HTMLElement.prototype.__defineSetter__来达到跨浏览器性。这个和innerHTML的区别在那?见例子<p><b>abc</b></p> p.innerHTML //<b>abc</b>p.oute 阅读全文
posted @ 2012-03-14 10:31 小玉西瓜 阅读(314) 评论(1) 推荐(1) 编辑
摘要: 事件委托的概念大家都很清楚,如果在某个元素上使用mouseover/mouseout的话,很有可能就被动的委托了这个事件。该元素中的子元素都会触发mouseover/mouseout而且无法通过停止冒泡来处理这个烦人的意外情况。 在ie上有两个非常好的事件,mouseenter/mouseleave他们不会冒泡,当然不会产生这个问题。新版本的ff10opera11都有支持这个事件。遗憾的是chrome19还没有支持。流行的类库比如jquery已经支持这个事件了。对于不支持这两个事件的浏览器必须自己处理了。 通过处理mouseover/mouseout也可以达到mouseenter/mo... 阅读全文
posted @ 2012-03-13 15:34 小玉西瓜 阅读(2189) 评论(4) 推荐(3) 编辑
摘要: 这个是同事分享的,拿出来给大家共享一下。w3c 地址https://dvcs.w3.org/hg/webperf/raw-file/tip/specs/NavigationTiming/Overview.html#sec-window.performance-attribute相比其他浏览器api 这个api可能关注度不高但是很有用。直接上图这个api有两个属性performance.timing 记录浏览器各项开销时间performance.navigation 记录浏览器状态浏览器支持情况chrome 6+ ie9+ ff7+ android4+ 阅读全文
posted @ 2012-01-11 17:30 小玉西瓜 阅读(725) 评论(0) 推荐(1) 编辑
摘要: 最近被暴库的很多,密码安全成为重大问题!如何避免简单密码呢?还在冥思苦想密码?no我为大家准备了一个密码生成工具,有0-9和a-k的英文字母组成,数字是乱序排列。字母随机一个替换掉一个数字,生成一个长度为10的密码。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/ 阅读全文
posted @ 2011-12-22 15:30 小玉西瓜 阅读(2426) 评论(12) 推荐(1) 编辑
摘要: 在普通情况下我们要用原生类、或者自定义类创建实例要用new运算符,使构造函数创建一个实例,并且实例继承构造器prototype上的所有公有方法。如 new Object()、new Date()等等!(object有{},数组有[]这样的快捷方式 ,我们主要探讨new这种方式。) 我们在使用jQuery时从来没有使用过new,他是不是用其他方法来生成实例呢?是不是没有使用prototype属性呢?事实上他都有使用,只是内部处理的非常巧妙,提高了使用的爽快度。我们来看看他的源码funtion jQuery( selector, context){ return new jQuery.fn... 阅读全文
posted @ 2011-12-20 23:42 小玉西瓜 阅读(2911) 评论(5) 推荐(5) 编辑
摘要: Javascript中大家都很习惯用new运算符创建实例。现在看看另外一种创建实例的方法------单例模式。单例模式的意思就是只有一个实例。单例模式确保某一个类只有一个实例,而且自行实例化并向整个系统提供这个实例。单例模式的特点有:1,该类只有一个实例2,该类自行创建该实例(在该类内部创建自身的实例对象)3,向整个系统公开这个实例接口。下面我们分析一下实现的可行性第1个特点:Javascript是不支持重载的,如果不能被new的话,多次调用会被覆盖所以第一点也很好实现第2个特点:自行创建实例这点我们用匿名包装器也比较好实现第2个特点:javascript是运行在宿主环境中的,我们向globa 阅读全文
posted @ 2011-12-15 16:38 小玉西瓜 阅读(1978) 评论(6) 推荐(4) 编辑
摘要: web技术近两年来发展迅速,随着开发环境的变化,我们也能使用新技术来提高生产力。javascript1.6对数组增加了一系列的新方法,可能大家都比较熟悉了。下面看看javascript1.7带来的新变化,想要使用新版本的javascript要使用支持新版本的浏览器,比如firefox最高已经支持javascript1.8.5,同时要处理一下scirpt标签的mime类型为:<script type="application/javascript;version=1.7">例如:1 <script type="application/javascr 阅读全文
posted @ 2011-12-13 16:37 小玉西瓜 阅读(3526) 评论(12) 推荐(3) 编辑
摘要: 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; c 阅读全文
posted @ 2011-12-11 01:01 小玉西瓜 阅读(353) 评论(0) 推荐(1) 编辑
摘要: 在某些浏览器不支持type number时这个是一个很好的替代方案 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <meta http-equiv="Content-T 阅读全文
posted @ 2011-12-09 10:47 小玉西瓜 阅读(1158) 评论(0) 推荐(3) 编辑
摘要: 相信大家都在高性能javascript或者红宝书上看见过这个,书里面的有误这个是已勘误过的。 1 function duffsDevice(items, fn) { 2 if ('function' !== typeof(fn)) return; 3 var iterations = items.length % 8, i = items.length - 1,callback = fn; 4 while (iterations) { 5 callback(items[i--]); 6 ... 阅读全文
posted @ 2011-12-08 22:00 小玉西瓜 阅读(249) 评论(0) 推荐(0) 编辑
摘要: 利用这个类可以保存方法的的实参,函数以后备用。在实例生成时会产生一个序列号用来标识是否来自undo或者redo的调用,从而避免存入缓存栈。在浏览器中用调试工具看调用结果View Code 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <html xmlns="http://www.w3.org/1999/xhtml&qu 阅读全文
posted @ 2011-12-08 21:59 小玉西瓜 阅读(994) 评论(0) 推荐(2) 编辑