代码改变世界

IE6下window.location.href不跳转到相应url

2013-10-16 17:47 by jelly_chow, 660 阅读, 0 推荐, 收藏, 编辑
摘要:前天一同事遇到个看似很诡异的问题,就是在IE6下面没反应,不跳转到onclik事件中的"window.location.href"。当时我们在网上找了篇文章很快就解决了,但是文章中没有说明具体原因在哪里,只是说在"window.location.href"后面加一个"return false",当时马上建了个test.html,试了下确实可以,而且试了之后还发现IE6下是被href="javascript:void(0)"覆盖了,这问题看上去很简单,但是为什么其他浏览器没有被覆盖,但对原因到底在哪里还是一头雾水。为 阅读全文

关于加速网站的最佳实践

2013-10-15 15:05 by jelly_chow, 332 阅读, 0 推荐, 收藏, 编辑
摘要:译文 :http://developer.yahoo.com/performance/rules.html1.减少HTTP请求最终用户80%的响应时间都花在前端。大部分的时间是花在下载页面中所有的组件:图像、样式表、脚本、Flash等。减少组件的数量然后减少HTTP请求的数量。这是更快的渲染页面的关键。减少页面中组件的数量的一个方法是简化页面的设计。但是有没有一种方式可以构建更丰富的内容页面,,同时也实现快速响应呢?以下是一些技术可以在减少HTTP请求的数量的同时仍然支持丰富的页面设计。合并文件是减少HTTP请求的数量的一个方法,就是把所有脚合,所有CSS样式表,分别并成一个。当不同页面的脚本 阅读全文

JS的IE和FF兼容性问题汇总

2013-08-08 17:16 by jelly_chow, 263 阅读, 0 推荐, 收藏, 编辑
摘要:转自:蓝色理想以下以 IE 代替 Internet Explorer,以 MF 代替 Mozilla FF一、函数和方法差异1. getYear()方法【分析说明】先看一下以下代码:var year=new Date().getYear();document.write(year); 在IE中得到的日期是"2010",在Firefox中看到的日期是"110",主要是因为在 Firefox 里面 getYear 返回的是 "当前年份-1900" 的值。【兼容处理】 加上对年份的判断,如:var year=new Date().getYe 阅读全文

解决flash挡住层的问题

2013-07-09 12:03 by jelly_chow, 327 阅读, 0 推荐, 收藏, 编辑
摘要:让div在flash上面设置flash为透明:插件代码换成如下:window 模式默认情况下的显示模式,在这种模式下flash player有自己的窗口句柄,这就意味着flash影片是存在于Windows中的一个显示实例,并且是在浏览器核心显示窗口之上的,所以flash只 是貌似显示在浏览器中,但这也是flash最快最有效率的渲染模式。由于他是独立于浏览器的HTML渲染表面,这就导致默认显示方式下flash总是会遮 住位置与他重合的所有DHTML层。但是大多数苹果电脑浏览器会允许DHTML层显示在flash之上,但当flash影片播放时会出现比较诡异的现象,比如DHTML层像被flash刮掉一 阅读全文

javascript 代码优化工具 UglifyJS

2013-07-05 11:34 by jelly_chow, 405 阅读, 0 推荐, 收藏, 编辑
摘要:安装:1. 安装 node.js 环境 (这个不用我教了吧,网上教程一大堆哦。)2. 进入https://github.com/mishoo/UglifyJS右上角 “Download” ZIP下载整个包。3. 解压打开UglifyJS/bin/uglifyjs4. 找到global.sys = require(/^v0\.[012]/.test(process.version) ? "sys" : "util");var fs = require("fs");var uglify = require("uglify-js& 阅读全文

理解面向对象

2013-06-26 11:23 by jelly_chow, 210 阅读, 0 推荐, 收藏, 编辑
摘要:什么叫面向对象?对象的定义 属性的无序集合,每个属性存放一个原始值,对象或函数 每个对象都由类定义,类定义对象的接口(属性和方法)及对象的内部工作。类创建的对象叫做类的实例。对象的构成: 对象由特性构成,特性可以是原始值,也可以是引用值。 如果特性存放的函数,则是对象的方法,否则则是对象的属性类的实例化: 由类创建对象实例的过程 面向对象语言的能力要求 : 封装:把相关的信息(数据或方法)存储在对象中的能力 聚焦:把一个对象存储在另一个对象内的能力 继承:由另一个类得来类的属性和方法的能力 多态:编写能以多种方法运行的函数或方法的能力 阅读全文

js中的等号与非等号

2013-06-25 18:05 by jelly_chow, 580 阅读, 0 推荐, 收藏, 编辑
摘要:等号与非等号都会进行类型转换,转换规则如下:1 如果有一个是boolean值,则true改为1,false改为0 false == 0 ; true == 1 返回true true == 2 返回false2 字符串 == 数字 则先把字符串转换为数字再进行比较3 对象 == 字符串 则先把对象转换为字符串再进行比较4 对象 == 数字则先把对象转换为数字再进行比较特别地:null == undefined 返回truenull 与 undefined不能转换成其它类型Nan 与任何值都不等,包括他自己对象 == 对象 比较的是它们的引用值,如果指向同一对象,则返回true 阅读全文

js 的数据类型转换

2013-06-21 18:38 by jelly_chow, 398 阅读, 0 推荐, 收藏, 编辑
摘要:一直对js的类型转换一直半解,今天理一下思路,首先说一下几个特殊的数值null null是特殊的object,故 typeof null 返回object, null派生于undefined ,故 null == undefinedNaN NaN是特殊的Number, NaN与任何值(包括自己)进行比较都返回falseBoolean 只有两值,false和true-----------------------------------------------------------------------------------------接下来,来说一下进入正题:toString():... 阅读全文

js优化 ----js的有序加载

2013-06-21 12:04 by jelly_chow, 425 阅读, 0 推荐, 收藏, 编辑
摘要:说到有序加载,我们先来说说js的无序加载:<script src="jquery/jquery-1.4.1.js" type="text/javascript"></script><script type="text/javascript"> window.onload = function () { $("#head").append("<script src='js/hello.js' type='text/javascript' 阅读全文

各浏览器对页面外部资源加载的策略

2013-06-21 11:51 by jelly_chow, 515 阅读, 0 推荐, 收藏, 编辑
摘要:转自:http://www.iefans.net/liulanqi-waibu-ziyuan-jiazai/测试样例测试的页面结构如下:head1.css + 1.jsbody1.jpg + 2.jpg + 2.js + 2.css + 3.jpg + 4.jpg + 3.css + 3.js + 5.jpg + 6.jpg共12个外部资源,加上页面本身,一次完整的加载一共有13次HTTP GET请求。针对每一个外部资源,服务器首先会休眠5秒的时间,随后再返回相应的内容,以方便查看整个外部资源的加载过程。测试的浏览器如下:IE6IE8Firefox3.6Firefox4.0 beta12Chr 阅读全文

js 执行效率

2013-06-21 11:10 by jelly_chow, 699 阅读, 0 推荐, 收藏, 编辑
摘要:循环 在JavaScript中,我们可以使用for(;;),while(),for(in)三种循环,这三种循环中for(in)的效率极差,因为他需要查询散列键,只要可以就应该尽量少用。for(;;)和while循环的性能应该说基本(平时使用时)等价。 在使用这两个循环时,经过测试得出一下一些结论: 如果是循环变量递增或递减,不要单独对循环变量赋值,应该在它最后一次读取的时候使用嵌套的++或—操作符。 如果要与数组的长度作比较,应该事先把数组的length属性放入一个局部变量中,减少查询次数。局部变量和全局变量 局部变量的速度要比全局变量的访问速度更快,因为全局变量其实是全局对... 阅读全文

脚本的加载,解析,与执行

2013-06-20 18:05 by jelly_chow, 639 阅读, 0 推荐, 收藏, 编辑
摘要:<script> 标签引入脚本有三种情况:立即执行<script src="a.js"><script src="b.js">顺序:保证先后顺序。解析:HTML 解析器遇到它们时,将阻塞(取停止解析),待脚本下载完成并执行后,继续解析标签之后的文档。浏览器对它的处理主要有2部分:下载和执行 下载在有些浏览器中是并行的,有些浏览器中是串行的,如IE8、Firefox3、Chrome2都是并行下载的 执行在所有浏览器中默认都是阻塞的,当js在执行时不会进行html解析等其它操作,所以页面顶部的js不宜过大,因为那样将导致页 阅读全文

jQuery的.bind()、.live()和.delegate()之间区别

2013-06-20 17:07 by jelly_chow, 216 阅读, 0 推荐, 收藏, 编辑
摘要:摘要:jQuery的.bind()、.live()和.delegate()之间的区别并非总是那么明显的,然而,如果我们对所有的不同之处都有清晰的理解的话,那么这将会有助于我们编写出更加简洁的代码,以及防止在交互应用中弹出错误。 基本要素 DOM树 首先,可视化一个HMTL文档的DOM树是很有帮助的。一个简单的HTML页面看起来就像是这个样子: 事件冒泡(又称事件传播) 当我们点击一个链接时,其触发了链接元素的单击事件,该事件则引发任何我们已绑定到该元素的单击事件上的函数的执行。 $('a').bind('click',function() { alert(&qu 阅读全文

去除inline-block元素间间距的N种方法

2013-06-19 11:17 by jelly_chow, 385 阅读, 0 推荐, 收藏, 编辑
摘要:今天看了一下http://purecss.io/,发现其grids用了letter-spacing,为此很疑惑,百度了一把发现是为了解决display:inline-block的情况!byzhangxinxufromhttp://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=2357一、现象描述真正意义上的inline-block水平呈现的元素间,换行显示或空格分隔的情况下会有间距,很简单的个例子:<input /> <input type="submit" />间距就来了 阅读全文

offset() position() scrollTop() scrollLeft()

2013-06-18 18:12 by jelly_chow, 350 阅读, 0 推荐, 收藏, 编辑
摘要:(1)offset:获取当前元素相对于文档的高度。只对可见元素有效。 不管该元素如何定位,也不管其父元素如何定位,都是获取的该元素相对于当前视口的偏移(2) position:获取元素相对于最近的一个position为relative or absolute的元素的祖父节点的相对偏移。 事实上是把该元素当绝对定位来处理,获取的是该元素相当于最近的一个拥有绝对或者相对定位的父元素的偏移位置,如果其所有的父元素都为默认定位(static)方式,则其处理方式和offset()一样,是当前窗口的相对偏移(3)scrollTop/scrollLeft:是分别获取元素滚动条距顶端的距离。-------.. 阅读全文