有关Web前端的开发和JavaScript脚本及常用的JS框架。
11月10
因为Array没有indexOf方法，这样在一个数组中查找某个元素的索引时比较麻烦，为了调用方便，于是通过prototype原型扩展了Array.prototype.indexOf()，这样用起来就比较方便了。
Array.prototype.indexOf = function(item) {
for (var i = 0; i < this.length; i++) {
if (this[i] == item)
return i;
}
return -1;
}
用的时候直接
var arr=[1,2,3,4,5];
var index=arr.indexOf(1); //index==0
扩展了以后，用起来很爽很方便，一片和谐景象，但是某次是遍历数组元素的时候，使用for..in..循环，引发了其他的问题，打破了这个和谐的氛围。
var a=["张飞","关羽","刘备","吕布"];
for(var p in a){
document.write(p+"="+a[p]+"<br/>");
}
Array.prototype.indexOf = function(item) {
for (var i = 0; i < this.length; i++) {
if (this[i] == item)
return i;
}
return -1;
}
用的时候直接
var arr=[1,2,3,4,5];
var index=arr.indexOf(1); //index==0
扩展了以后，用起来很爽很方便，一片和谐景象，但是某次是遍历数组元素的时候，使用for..in..循环，引发了其他的问题，打破了这个和谐的氛围。
var a=["张飞","关羽","刘备","吕布"];
for(var p in a){
document.write(p+"="+a[p]+"<br/>");
}
9月21
你可能发现在css中指定的tr边框不起作用，而如果指定td的边框又会有间断的现象出现。这种情况下可以参照下面的代码：
对于某些浏览器，在设定了border-collapse为collapse之后也可以直接指定tr的边框。
对于某些浏览器，在设定了border-collapse为collapse之后也可以直接指定tr的边框。
9月21
一、引言
这么久以来，JavaScript在Web开发中一直处于被忽视的地位，甚至有相当一部分开发人员对它产生了误解，认为JavaScript只不过是用来完成一些花哨功能的雕虫小技。网络上广为流传的低质量的JavaScript代码对此也起到了推波助澜的作用...很多应用中JavaScript都采用了面向过程的编程方式，代码的可扩展性不好，复制粘贴的代码比比皆是...
随着Ajax等技术的广泛使用，YUI、Prototype等对JavaScript的应用可谓是淋漓尽致、出神入化。人们才发现原来JavaScript可以实现如此强大的功能，具备如此优雅的架构...
二、准备
1、概念
JavaScript是一种弱类型语言。包括：
基本类型：数字Number，字符串String，布尔值Boolean；
复合类型：对象Object，数组Array；
工具类型：全局对象Global，日期Date，数学对象Math，正则表达式RegExp，错误对象Error；
特殊类型：函数Function。
这里我只想说两点：
1）基本数据类型的包装对象
每一个基本数据类型都有一个对应的对象类。可以灵活地实现类型转换。简单地说，JavaScript不仅支持数字、字符串和布尔值这些数据类型，还支持Number、String、Boolean类，这些类是基本数据类型的包装(wrapper)。
例子：
这里，s保存了一个字符串，原始的字符串值是不会改变的。一个新的String对象被创建了，实现了对长度属性的访问，之后它就被销毁了。
这么久以来，JavaScript在Web开发中一直处于被忽视的地位，甚至有相当一部分开发人员对它产生了误解，认为JavaScript只不过是用来完成一些花哨功能的雕虫小技。网络上广为流传的低质量的JavaScript代码对此也起到了推波助澜的作用...很多应用中JavaScript都采用了面向过程的编程方式，代码的可扩展性不好，复制粘贴的代码比比皆是...
随着Ajax等技术的广泛使用，YUI、Prototype等对JavaScript的应用可谓是淋漓尽致、出神入化。人们才发现原来JavaScript可以实现如此强大的功能，具备如此优雅的架构...
二、准备
1、概念
JavaScript是一种弱类型语言。包括：
基本类型：数字Number，字符串String，布尔值Boolean；
复合类型：对象Object，数组Array；
工具类型：全局对象Global，日期Date，数学对象Math，正则表达式RegExp，错误对象Error；
特殊类型：函数Function。
这里我只想说两点：
1）基本数据类型的包装对象
每一个基本数据类型都有一个对应的对象类。可以灵活地实现类型转换。简单地说，JavaScript不仅支持数字、字符串和布尔值这些数据类型，还支持Number、String、Boolean类，这些类是基本数据类型的包装(wrapper)。
例子：
这里，s保存了一个字符串，原始的字符串值是不会改变的。一个新的String对象被创建了，实现了对长度属性的访问，之后它就被销毁了。
9月20
Div即父容器不根据内容自适应高度
，我们看下面的代码：
程序代码
<div id="main">
<div id="content"></div>
</div>
当Content内容多时，即使main设置了高度100%或auto。在不同浏览器下还是不能完好的自动伸展。内容的高度比较高了，但容器main的高度还是不能撑开。
我们可以通过三种方法来解决这个问题。
一，增加一个清除浮动，让父容器知道高度。请注意，清除浮动的容器中有一个空格。
程序代码<div id="main">
<div id="content"></div>
<div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
</div>
，我们看下面的代码：程序代码
<div id="main">
<div id="content"></div>
</div>
当Content内容多时，即使main设置了高度100%或auto。在不同浏览器下还是不能完好的自动伸展。内容的高度比较高了，但容器main的高度还是不能撑开。
我们可以通过三种方法来解决这个问题。
一，增加一个清除浮动，让父容器知道高度。请注意，清除浮动的容器中有一个空格。
程序代码<div id="main">
<div id="content"></div>
<div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
</div>
9月10
有关于浏览器CSS BUG的一些兼容问题和具体案例总结如下
，供自己以后查看，也分享给大家，以便大家节约学习和工作的时间，如果你有什么好的方法对浏览器兼容方面，那么也请你和大家一起分享下。
1.div的垂直居中问题
vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字，就垂直居中了。缺点是要控制内容不要换行。
2. margin加倍的问题
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。
解决方案是在这个div里面加上display:inline;
，供自己以后查看，也分享给大家，以便大家节约学习和工作的时间，如果你有什么好的方法对浏览器兼容方面，那么也请你和大家一起分享下。1.div的垂直居中问题
vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字，就垂直居中了。缺点是要控制内容不要换行。
2. margin加倍的问题
设置为float的div在ie下设置的margin会加倍。这是一个ie6都存在的bug。
解决方案是在这个div里面加上display:inline;
9月10
有关于Web前端优化的一些方法总结，面向内容的优化规则目前有10条，同时如果你有什么好的方法的话也希望你和大家一起来分享下
。
1. 尽量减少 HTTP 请求 (Make Fewer HTTP Requests)
作为第一条，可能也是最重要的一条。根据 Yahoo! 研究团队的数据分析，有很大一部分用户访问会因为这一条而取得最大受益。有几种常见的方法能切实减少 HTTP 请求：
。1. 尽量减少 HTTP 请求 (Make Fewer HTTP Requests)
作为第一条，可能也是最重要的一条。根据 Yahoo! 研究团队的数据分析，有很大一部分用户访问会因为这一条而取得最大受益。有几种常见的方法能切实减少 HTTP 请求：
1) 合并文件，比如把多个 CSS 文件合成一个；
2) CSS Sprites 利用 CSS background 相关元素进行背景图绝对定位；参见：CSS Sprites: Image Slicing’s Kiss of Death
3) 图像地图
4) 内联图象 使用 data: URL scheme 在实际的页面嵌入图像数据.
9月10
今天看JavaScript高级程序设计第8章检测浏览器和操作系统时，发现浏览器发展历史带着一种没有统一规范的过程走到了今天，这些混乱的过程，主要体现在user-agent字符串内容上，用了Win的人，很多都无知地认为世界只有IE这么一个浏览器，对他们来说带着一种打开浏览器就是打开IE的意思，没有Mozilla,Opera,Konqueror,Safari,NetScape这些可选的概念，但对于Web人员则不能对这些无知了，一个可靠的javaScript脚必须针对不同的客户平台作出不同准确识别，不单是浏览器类型对javaScript函数调用有关，浏览器依附的操作系统平台对浏览器的支持功能也有制约和支持,书中附带的detect.js，软完整给出了针对一系列用户浏览器和操作系统平台的检测，虽然直接对Code看难理解，不过跟着书本解析，理解起来还是不难的，里面几乎全是通过对user-agent字符串信息分析得到的,我往代码里添加了自己的注释。
detect.js
，发现浏览器发展历史带着一种没有统一规范的过程走到了今天，这些混乱的过程，主要体现在user-agent字符串内容上，用了Win的人，很多都无知地认为世界只有IE这么一个浏览器，对他们来说带着一种打开浏览器就是打开IE的意思，没有Mozilla,Opera,Konqueror,Safari,NetScape这些可选的概念，但对于Web人员则不能对这些无知了，一个可靠的javaScript脚必须针对不同的客户平台作出不同准确识别，不单是浏览器类型对javaScript函数调用有关，浏览器依附的操作系统平台对浏览器的支持功能也有制约和支持,书中附带的detect.js，软完整给出了针对一系列用户浏览器和操作系统平台的检测，虽然直接对Code看难理解，不过跟着书本解析，理解起来还是不难的，里面几乎全是通过对user-agent字符串信息分析得到的,我往代码里添加了自己的注释。detect.js
9月10
下面来讨论下jsp页面用XMLHttpRequest简单的异步调用，请看例子程序步骤
：
a.创建一个新的XMLHttpRequest--function newXMLHttpRequest()
b.创建DOM事件处理器--function onContinentChanged(selectCont, inForm)
c.创建回调函数callback--function displayNations(xmlData)
d.创建封装回调函数的函数--function getReadyStateHandler(requestFromServer, responseXMLHandler)
e.工具函数--IE下创建新的Dom文档--function createDomDoc()
前面五步在jsp接受的javaScript函数;
处理流程是 b捕html页面事件，a创建新XMLHttpRequest，a利用c往XMLHttpRequest里这塞url，和回调函数，还有其它参数;由于沙箱原理，所有由XMLHttpRequest访问的url都不会离开本页面的根地址;
具体函数内容在下面
a.新建XMLHttpRequest
，请看例子程序步骤：a.创建一个新的XMLHttpRequest--function newXMLHttpRequest()
b.创建DOM事件处理器--function onContinentChanged(selectCont, inForm)
c.创建回调函数callback--function displayNations(xmlData)
d.创建封装回调函数的函数--function getReadyStateHandler(requestFromServer, responseXMLHandler)
e.工具函数--IE下创建新的Dom文档--function createDomDoc()
前面五步在jsp接受的javaScript函数;
处理流程是 b捕html页面事件，a创建新XMLHttpRequest，a利用c往XMLHttpRequest里这塞url，和回调函数，还有其它参数;由于沙箱原理，所有由XMLHttpRequest访问的url都不会离开本页面的根地址;
具体函数内容在下面
a.新建XMLHttpRequest
