摘要: 很不错的javascript语句,你经常用吗?1. 取整同时转成数值型:'10.567890'|0结果: 10'10.567890'^0结果: 10-2.23456789|0结果: -2~~-2.23456789结果: -2 2. 日期转数值:var d = +new Date(); //1295698416792 3. 类数组对象转数组:var arr = [].slice.call(arguments) 4. 漂亮的随机码:Math.random().toString(16).substring(2); //14位Math.random().toString 阅读全文
posted @ 2012-10-24 11:13 无赖君子 阅读(306) 评论(0) 推荐(0) 编辑
摘要: 我想大家在做项目的时候都遇到这样的需求:对于一些列表文本过长溢出显示省略号,我们可以text-overflow:ellipsis很简单地达到效果,很遗憾不能兼容火狐浏览器。text-overflow被列入了CSS3属性,火狐对于标准的实现一向都很好,很郁闷为什么没有实现这个(FireFox 7.0貌似已经实现了)。有三种办法可以实现:方法1:用css实现text-overflow:ellipsisHTML代码:用CSS解决 text-overflow:ellipsis引起兼容性问题解决办法 text-overflow:ellipsis引起兼容性问题解决办法 text-over... 阅读全文
posted @ 2012-09-19 17:10 无赖君子 阅读(7943) 评论(0) 推荐(24) 编辑
摘要: 最近做了个项目,居然在一个小小的css问题上折腾了很久很是纠结——外边距折叠的问题。今天难得清闲,就把这个问题研究了一下,才发现大有学问,所以写篇博文整理一下,以便更加牢记! 外边距折叠,指的是毗邻的两个或多个外边距 (margin) 在垂直方向会合并成一个外边距。 触发条件:毗邻,没有被非空内容、padding、border或clear分隔开的margin特性. 非空内容就是说这元素之间要么是兄弟关系或者父子关系这些 margin 都处于普通流中,即非浮动元素,非定位元素 垂直方向外边距合并的计算 1) 参加折叠的margin都是正值:取其中 margin 较大的值为最终 mar... 阅读全文
posted @ 2012-09-18 16:28 无赖君子 阅读(2142) 评论(3) 推荐(1) 编辑
摘要: HTML5提供了跨文档消息机制(Cross Document Messaging),它提供了跨越frame、tabs或windows通信的能力。PostMessage API要接收消息的页面需要添加相应的事件监听器,在消息到来时你可以检测其来源来并判断是否处理。浏览器的支持情况:检测浏览器支持:if (typeof window.postMessage === “undefined”) { // postMessage not supported in this browser}发送消息:发送消息给另一个页面:window.postMessage(“Hello, world”, “porta. 阅读全文
posted @ 2012-08-22 15:57 无赖君子 阅读(514) 评论(0) 推荐(0) 编辑
摘要: 我们总是将一个图形画在另一个之上,大多数情况下,这样是不够的。比如说,它这样受制于图形的绘制顺序。不过,我们可以利用globalCompositeOperation属性来改变这些做法。globalCompositeOperation= type我们不仅可以在已有图形后面再画新图形,还可以用来遮盖,清除(比clearRect方法强劲得多)某些区域。type是下面 12 种字符串值之一:注意:下面所有例子中,蓝色方块是先绘制的,即“已有的 canvas 内容”,红色圆形是后面绘制,即“新图形”。source-over(default)这是默认设置,新图形会覆盖在原有内容之上。destination 阅读全文
posted @ 2012-08-16 17:42 无赖君子 阅读(942) 评论(0) 推荐(0) 编辑
摘要: 今天在网上看到一篇介绍javascript的文章,尽管文章讲述的内容我都很熟悉,但我还是要转载出来让大家读一读,这个哥们的文采真是没的说,能将本来枯燥的程序讲述的如此酣畅淋漓实在让人佩服!随笔发表,只为弘扬“佛法”,别无他意,请哥们见谅。原文如下: 编程世界里只存在两种基本元素,一个是数据,一个是代码。编程世界就是在数据和代码千丝万缕的纠缠中呈现出无限的生机和活力。 数据天生就是文静的,总想保持自己固有的本色;而代码却天生活泼,总想改变这个世界。 你看,数据代码间的关系与物质能量间的关系有着惊人的相似。数据也是有惯性的,如果没有代码来施加外力,她总保持自己原来的状态。而代码就象能量,他存在的. 阅读全文
posted @ 2012-08-14 16:37 无赖君子 阅读(709) 评论(1) 推荐(2) 编辑
摘要: 用户在使用键盘时会触发键盘事件。目前,对键盘事件的支持主要遵循的是DOM0级。 在英文输入法下,所有浏览器都遵循以下三个事件:keydown: 当用户按下任意键时触发,而且按住不放的话,会重复触发此事件。keypress: 当用户按下字符键时触发,而且按住不放的话,会重复触发此事件。按下Esc键也会触发这个事件,Safari3.1之前的版本按下非字符键时也触发。keyup: 当用户释放键时触发。 在中文输入法下,浏览器之间则表现得不一致,主要情况如下:IE,Chrome,Safari:触发keydown和keyup, 不触发keypress。Firefox:首次按下按键时触发keydo... 阅读全文
posted @ 2012-08-01 15:27 无赖君子 阅读(15134) 评论(2) 推荐(23) 编辑
摘要: 废话少说,先上代码:/* 除了IE6的主流浏览器通用的方法支持position:fixed */.fixed_t{position:fixed;bottom:auto;top:0px;}.fixed_b{position:fixed;bottom:0px;top:auto;}.fixed_l{position:fixed;right:auto;left:0px;}.fixed_r{position:fixed;right:0px;left:auto;}/*让position:fixed在IE6下可用! */*html{background-image:url(about:blank);back 阅读全文
posted @ 2012-07-24 14:14 无赖君子 阅读(1497) 评论(0) 推荐(0) 编辑
摘要: 浏览器差异:Firefox的滚轮事件是DOMMouseScroll,其他浏览器使用的是mousewheelFirefox事件的event对象使用detail值表示滚轮方向,负3表示向上(前),正3表示向下(后)。其他浏览器使用wheelDelta值表示滚轮方向,正120表示向上(前),负120表示向下(后)。Opera 11.11即有detail值(同FF)也有wheelDelta值。不要和正负3或正负120做等值比较来滚轮判断方向,应该和零比较。比如wheelDelta值大于0表示向上(前)。这么做的原因是有些用户的鼠标是基于厂家自己的驱动运行的,有更高级的灵敏度识别,在用户快速滚动滑轮的时 阅读全文
posted @ 2012-07-10 17:34 无赖君子 阅读(970) 评论(0) 推荐(0) 编辑
摘要: 记得在刚接触iframe框架的时候,对其并不是很了解,感觉用处也不大,然而最近在给站点加上一个微博直播控件的时候遇到了它,也不得不以SEO的角度来考量它,经过分析后,笔者认为ifame框架存在一定的优缺点。 首先我们需要了解一下什么是iframe框架? 如果我们在某一个页面中使用这个标签就会在该页面内构建一个独立的框架,例如页面1内的一个区域内使用ifram调用另外一个页面,即网页2,这样的话会在页面1的这个区域里调用显示页面2中被调用的部分。使用方法: 或其他网页的本文内容等写入标签内部即可,现在让我们来以SEO的角度看看,在我们的站点上使用iframe框架所存在的优缺点。 一:... 阅读全文
posted @ 2012-07-10 14:59 无赖君子 阅读(1339) 评论(0) 推荐(0) 编辑
摘要: frameset和div常规布局的优缺点比较用frameset来布局的优点:1,在frameset里使用iframe来实现常规的一些分栏布局,可以借助一个页面承载多个页面的方式来重用页面代码。2,一个页面中的iframe之间可以互相实现关联,而且不需要依靠过多的js就可以实现类似“局部”刷新的机制。3,一些常见的后台管理系统大部分是用这种方式来布局的(追其原因可能是上面2点),所以固定了思维系统布局可能用frameset来实现比较好。用frameset来布局的缺点:1,如果要实现不同iframe之间的dom元素产生互动和关联,需要的js复杂程度较高,而且有些根本实现不了(比如拖拽,比如用户自定 阅读全文
posted @ 2012-07-10 14:57 无赖君子 阅读(2479) 评论(1) 推荐(0) 编辑
摘要: ASCLL码表ASCII值控制字符ASCII值控制字符ASCII值控制字符ASCII值控制字符0NUT32(space)64@96、1SOH33!65A97a2STX34”66B98b3ETX35#67C99c4EOT36$68D100d5ENQ37%69E101e6ACK38&70F102f7BEL39,71G103g8BS40(72H104h9HT41)73I105i10LF42*74J106j11VT43+75K107k12FF44,76L108l13CR45-77M109m14SO46.78N110n15SI47/79O111o16DLE48080P112p17DCI49181 阅读全文
posted @ 2012-07-09 22:00 无赖君子 阅读(30172) 评论(1) 推荐(4) 编辑
摘要: 关于浏览器中DOM操作的性能优化,在上一篇博文《浏览器中DOM操作的性能优化(一)》中已经阐述了访问和修改DOM元素对性能的影响及优化方案。这次我们就来说一下关于页面的重绘和重排版问题。 当浏览器下载完所有的HTML标签和其组件(Javascript,css,图片等)后,浏览器就会解析文件并创建两个内部数据结构: 1、DOM Tree :表示页面的结构 2、Render Tree :表示DOM树如何显示 在渲染树仲,每个DOM节点(隐藏的节点除外)都有至少一个相对应的节点。渲染树的节点被称为“盒”,符合CSS定义的盒子模型——一个具有填充(padding)、边框(border)、边... 阅读全文
posted @ 2012-07-03 11:16 无赖君子 阅读(2501) 评论(0) 推荐(2) 编辑
摘要: 频繁地对于DOM进行操作的很是损耗性能,但在富网页应用中我们编写脚本无可避免地要跟DOM打交道,到底怎么才能优化这个性能瓶颈呢,大致从以下三种情况去考虑:访问和修改DOM元素修改DOM样式,会造成页面的重绘和重新排版通过DOM事件处理程序来响应用户 访问和修改DOM元素 在浏览器中,DOM的实现和Javascript的实现通常是保持相互独立的。下面了解一下主流浏览器的渲染引擎和JS引擎: 浏览器 渲染引擎(内核) JS引擎 IE mshtml.dll(Trident) JScriptChrome WebCore(WebKit) V8FireFox Gecko ... 阅读全文
posted @ 2012-07-02 16:29 无赖君子 阅读(3376) 评论(7) 推荐(3) 编辑
摘要: 在javascript中,数据的存储位置对代码的整体性能有着重要的影响。有四种数据访问类型:直接量,局部变量,数组项,对象成员。直接量和局部变量访问的都非常快,数组项和对象成员的访问速度就有待优化了。 局部变量也就可以理解为在函数内部定义的变量,很明显访问局部变量要比域外的变量要快,因为它位于作用域链的第一个变量对象中(关于作用域链的介绍可以阅读这篇文章)。变量在作用域链的位置越深,访问所需要的时间就越长,全局变量总是最慢的,因为它们位于作用域链的最后一个变量对象。 每种数据类型的访问都需要付出点性能代价,对于直接量和局部变量基本都能消费得起,而访问数组项和对象成员则要代价高点。下图显... 阅读全文
posted @ 2012-06-29 15:46 无赖君子 阅读(1681) 评论(7) 推荐(3) 编辑