JavaScript -- IT技术博客大学习 -- 共学习共进步！

“变则通，通则达”，在coding的时候也要做到，有时候思路往往太过于局限性，拿今天写自己的js框架（暂定名为YQ吧，以后文章通用）对浏览器判断方法的实例，来说说代码思路的转变。

浏览器的用户界面和JavaScript代码共享同一个处理进程。无论是浏览器需要响应一个菜单的点击，还是渲染一个页面或者执行Ajax请求，每一个事件都会添加到一个队列中。当浏览器空闲的时候，就会继续执行队列中的任务。浏览器的线程实际上，在高端一些的浏览器中都不是只有一个线程。作为极端的例子，IE9和Chrome会为每一个tab生成一个系统的进程。然而，对于每一个页面来说，仍然只有一个事件处理的队列，也就意味着一次只能执行一...

• JavaScript，只有你想不到

很长时间以来，JavaScript在我眼里都是编程语言中的二等公民。早先，它经常是很多安全问题的发源地，就像是胶水一样，它能把HTML应用与样式粘到一块，可没有人拿它来正正规规地编写程序；这样的情形太普遍了。而Java、Ruby、Python，这些才是真正能用来编写程序的语言。过去几年间，我对JavaScript的态度有了彻底的改变。JavaScript已经“长大成人”了。我...

• 快速排序（Quicksort）的Javascript实现

日本程序员norahiko，写了一个排序算法的动画演示，非常有趣。这个周末，我就用它当做教材，好好学习了一下各种排序算法。排序算法(Sorting algorithm)是计算机科学最古老、最基本的课题之一。要想成为合格的程序员，就必须理解和掌握各种排序算法。目前，最常见的排序算法大概有七八种，其中"快速排序"(Quicksort)使用得最广泛，速度也较快。它是图灵奖得主C. A. R. Hoare(1934--)于1960时提出来的。 "快速排序"的思想很...

• 在 JavaScript 中监听 IME 键盘输入事件

在 JavaScript 中监听用户的键盘输入是很容易的事情，但用户一旦使用了输入法，问题就变得复杂了。输入法应当如何触发键盘事件呢？是每一下击键都触发一次事件，还是选词完毕才触发事件呢？整句输入又该如何触发事件呢？不同的操作系统和不同的浏览器对此有不同的看法。在最糟糕的情况下，用户使用输入法后浏览器就只触发一次 keydown ，之后就没有任何的键盘事件了。这对于 Suggestion 控件的实现来说是个大问题，因为 Suggestion...

• Javascript继承机制的设计思想

我一直很难理解Javascript语言的继承机制。它没有"子类"和"父类"的概念，也没有"类"（class）和"实例"（instance）的区分，全靠一种很奇特的"原型链"（prototype chain）模式，来实现继承。我花了很多时间，学习这个部分，还做了很多笔记。但是都属于强行记忆，无法从根本上理解。

• javascript继承的写法

严格来说javascript是基于对象而不是面向对象的语言，因为javascript没有像java语言那么丰富的类、继承、封装，但是javascript是基于原型（prototype）的面向对象开发，是一种动态、弱类型、基于原型的语言。前几天看了阿里UED的《重温javascript继承机制》，今天重新看了，很有感触，特地转载了重要的部分，记录一下，下次有需要的时候还要重新看一下！的确是不错的一篇文章。继承的演变 1、采用new关键字生成实例处理表单验证...

• 优化innerHTML操作

多数现代浏览器都实现了innerHTML操作，它的方便性让我们爱不释手，但如果使用不当，很容易出现效率问题，本文通过一个例子来说明如何优化innerHTML操作。例子：我们要实现的大致效果是当用户点击鼠标的时候，就在旧数据上追加若干新数据。

• JavaScript本地存储实践（html5的localStorage和ie的userData）

本地存储解决方案很多，比如Flash SharedObject、Google Gears、Cookie、DOM Storage、User Data、window.name、Silverlight、Open Database等。借用网上的一张图来看下目前主流的本地存储方案： Cookie：在web中得到广泛应用，但局限性非常明显，容量太小，有些站点会因为出于安全的考虑而禁用cookie，cookie没有想象中的那么安全，Cookie 的内容会随着页面请求一并发往服务器。 Flash SharedObject：使用的是kissy的store模块...

• js判断一个元素是否为另一个元素的子元素

用js判断一个元素是否为另一个元素的子元素，再做一些效果的时候经常用到，特别是和鼠标事件相关的应用中，比如一个浮层，在鼠标操作浮层内元素的时候浮层显示，当点击浮层外的元素的时候隐藏浮层。当然方法有很多，不过个人认为通过判断一个元素是否为另一个元素的子元素是最简单的实现方式之一。

• 能说明你的Javascript技术很烂的五个原因

Javascript在互联网上名声很臭，但你又很难再找到一个像它这样如此动态、如此被广泛使用、如此根植于我们的生活中的另外一种语言。它的低学习门槛让很多人都称它为学前脚本语言，它另外一个让人嘲笑的东西是动态语言的概念是偏偏使用了高标准的静态数据类型。其实，你和Javascript都站错了立场，而现在，你让Javascript很生气。这里有五个原因能说明你的Javascript...

• 使用javascript将XML解析为JSON

今天看了David Walsh一篇把XML格式转换为JSON格式的文章，感觉不错，简单的转载了过来。

• IFrame带来的Session问题

客户原来有个Web App系统A，我们要基于A开发一个系统B，但不希望B对A依赖太重，所以B被实现为一个独立的Web App（war）。A和B部署在同一个Weblogic server上，在A中可以导航到B，两个系统看起来像是一个系统。有个小需求是，在B中希望显示一个页面，根据参数能展示出不同的信息。这个页面在A中已经存在，所以自然而然最快的方法就是在B中创建一个iframe来指向那个A中的页面，配以不同的参数，多快好省！问题很快出来了，QA发现那...

• URL正则表达式

分享一个同事写的URL正则表达式，缺点不支持中文URL。

• jQuery延时绑定事件(lazy-bind)

有个延时绑定事件的需求, 如等待鼠标停留在某图片上面一段时间之后才展示浮动层, 以避免鼠标滑过屏幕时一片乱闪. 一时找不到合适的插件, 所以自己写了个.

• Yslow简介

之前介绍过一次 Yslow ，最近又遇到了网站优化方面的问题，复习一遍：减少HTTP请求次数合并图片、CSS、JS，改进首次访问用户等待时间。使用CDN 就近缓存==>智能路由==>负载均衡==>WSA全站动态加速避免空的src和href 当link标签的href属性为空、script标签的src属性为空的时候，浏览器渲染的时候会把当前页面的URL作为它们的属性值，从而把页面的内容加载进来作为它们的值。测试为文件头指定Expires 使内容具有缓存性。避免了...

• NodeList集合跟Array数组的区别

由字面意思来看NodeList是DOM操作（getElementsByTagName等）取出来的集合，而不是普通的数组，但是他们有数组的一些属性，例如length、下标索引，但是他们也有自己的属性，例如item，另外NodeList最大的特点就是时效性（live）。

• insertContent-在文本框光标位置插入内容并选中

在文本框光标位置插入内容在实际的项目应用中经常用到，比如在文本框插入表情，首先要获取光标在文本框中的位置，当然这个有浏览器兼容性问题。 IE下可以通过document.selection.createRange();获取光标位置，代码也很简单： if (document.selection) { pos = document.selection.createRange(); pos.text = "要插入的字符串"; } Firefox浏览器则稍微负责一点，需要首先获取光标位置，然后对value进行字符串截取处理。

• 网页审查工具介绍

其实除了 firebug 之外，在其他浏览器上，也存在 Developer Tools、Dragonfly 等等开发者工具。在此简要介绍一下 Web Inspector（网页审查工具），希望可以方便大家在多领域进行网页开发。开启方法：在支持该功能的浏览器上（Chrome/Maxthon3/Safari），点击右键，调用“审查元素”：点击“审查元素”开启后的界面如下：元素（Elements）、资源 (Resources) 、脚本 (Scripts) 、时间轴 (Timeline) 剖析 (Profiles) 、存储 (Sto...

• 更好的用vim浏览Javascript代码

vim默认没有一般IDE的outline视图，浏览长篇Javascript源文件很麻烦，taglist插件正是弥补这点不足。它可以将所有方法和变量分级罗列出来，一目了然。taglist是依赖强大的ctags实现的。ctags支持41种编程语言，其中包括Javascript，但对Javascript支持较随意。