分类目录 ‘JavaScript’

优秀的Stoyan Stefanov在他的新书中(《 Patterns》)介绍了很多编写高质量代码的技巧,比如避免使用全局变量,使用单一的var关键字,循环式预存长度等等。

这篇文章不仅仅从代码本身来考虑如何优化编码,也从代码的设计阶段来考虑,包括书写API文档,同事的review,使用JSLint。这些习惯都 能帮助你编写更加高质量的、更易于理解的、可维护的代码(让你的代码在多年之后仍使你引以为傲)。

编写可维护的代码
软件的BUG修复需要花费大量的精力。尤其当代码已经发布之后,随着时间的增长,维护的成本愈发的高。当你一发现BUG的 时候,就立即去修复,这时候你的代码还是热乎的,你也不需要回忆,因为就是刚刚写好的。但是当你做了其他任务,几乎完全忘记了这份代码,这时候就需要:

重新学习和理解问题
理解代码是如何解决问题的
另外一个问题是,在大项目或者大公司里面,经常是解决BUG的人不是产生BUG的 人,而且也不是发现BUG的人。所以减少理解代码的时间就是最重要的问题,无论这个代码是你自己以前写的还是团队中的其他成员写的,因为我们都想去搞搞新 的有意思的东西,而不是去维护那些个陈旧的代码。
(全文 …)

在客户端编程语言中,如javascript和ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义。同源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和操作另外一个域的绝大部分属性和方法。那么什么叫相同域,什么叫不同的域呢?

同源策略

在客户端编程语言中,如javascript和 ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义。同源策略规定跨域之间的脚本是隔离的,一个域的脚 本不能访问和操作另外一个域的绝大部分属性和方法。那么什么叫相同域,什么叫不同的域呢?当两个域具有相同的协议(如http), 相同的端口(如80),相同的host(如www.example.org),那么我们就可以认为它们是相同的域。比如 http://www.example.org/index.html和http://www.example.org/sub/index.html是同域,而http://www.example.org, https://www.example.org, http://www.example.org:8080, http://sub.example.org中的任何两个都将构成跨域。同源策略还应该对一些特殊情况做处理,比如限制file协议下脚本的访问权限。 本地的HTML文件在浏览器中是通过file协议打开的,如果脚本能通过file协议访问到硬盘上其它任意文件,就会出现安全隐患,目前IE8还有这样的 隐患。
(全文 …)

jQuery越来越流行,也就越来越多的开发者制作各种各样的jQuery插件。它们当中的一些非常的酷,例如之前介绍的“2010年最佳jQuery插件”和现在有介绍的10个给力的jQuery图片插件

jquery image 9

如果你也想让你的博客上的图片让人眼前一亮,不妨试试WDL博客推荐的10个jQuery图片插件。
(全文 …)

2010年最佳jQuery插件

作者: seasun

在2010年,JavaScript框架继续日渐普及,这使得大量的插件被开发出来。满目琳琅,难以 选择心头之好。WDL的作者从大量的优秀jQuery插件精心筛选出一些对Web Designers有帮助的和具备非常不错的视觉效果的Best of the best。

2010年最佳jQuery插件

2010年最佳jQuery插件(排名不分先后):

Nivo Slider

2010年最佳jQuery插件 Nivo Slider
(全文 …)

1.5正式版于1月31日如期发布! jQuery是一个JavaScript库,它简化了HTML文档遍历,事件处理,动画和为网络快速发展的Ajax交互。变化包括一个重写的Ajax模 块,划分 jQuery子类的能力,以及许多其他功能增强,修复各种内存泄漏,性能改进和加强跨浏览器的兼容。鼓励测试该版本的用户提供反馈和报告他们遇到的任何错 误。 Right on schedule 1.5 is ready for consumption!
This release has been a long time coming and has been a real team effort. Please take this opportunity to thank members of the jQuery Team and the jQuery bug triage team for their help in getting this release out the door.

下载地址:
jQuery Minified (29kb Gzipped)
jQuery Regular (207kb)

Microsoft CDN: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.min.js
(全文 …)

每种语言都有它特别的地方,对于JavaScript来说,使用var就可以 声明任意类型的变量,这门脚本语言看起来很简单,然而想要写出优雅的代码却是需要不断积累经验的。本文利列举了JavaScript初学者应该注意的七个 细节,与大家分享。

(1)简化代码


JavaScript定 义对象和数组非常简单,我们想要创建一个对象,一般是这样写的:

var car = new Object();
car.colour = 'red';
car.wheels = 4;
car.hubcaps = 'spinning';
car.age = 4;

下面的写法可以达到同样的效果:

var car = {
	colour:'red',
	wheels:4,
  hubcaps:'spinning',
  age:4
}

后面的写法要短得多,而且你不需要重复写对象名称。
(全文 …)

百度js库tangram开源

作者: seasun

百度js库tangram宣布开源,Tangram是一套简单可依赖的Javascript库,它的特点:
* 体积小巧,性能优良,使用简单。
* 模块化架构,方便定制与扩展。
* 适合团队开发,丰富的中文文档和本地技术优化,适合中国用户。 *多浏览器支持:
IE6、7、8+
Frfox3.x+
傲游2.x+
Opera 10.x
Chrome 4.x+
Safari 4.x+

* 经过专业QA团队的测试以及百度各大产品线的应用,质量有保障。
(全文 …)

  1. var Url = location.href;
  2. Url = Url.replace(/.*\?(.*?)/,”$1″);
  3. Variables = Url.split (“&”);
  4. for (i = 0; i < Variables.length; i++) {
  5. Separ = Variables[i].split(“=”);
  6. eval (‘var ‘+Separ[0]+’=”‘+Separ[1]+’”‘);
  7. }
  8. function getURLParam(strParamName){
  9. var strReturn = “”;
  10. var strHref = window.location.href;
  11. if ( strHref.indexOf(“?”) > -1 ){
  12. var strQueryString = strHref.substr(strHref.indexOf(“?”)).toLowerCase();
  13. var aQueryString = strQueryString.split(“&”);
  14. for ( var iParam = 0; iParam < aQueryString.length; iParam++ ){
  15. if (aQueryString[iParam].indexOf(strParamName + “=”) > -1 ){
  16. var aParam = aQueryString[iParam].split(“=”);
  17. strReturn = aParam[1];
  18. break;
  19. }
  20. }
  21. }
  22. return strReturn;
  23. }

2010年最佳jQuery插件

作者: seasun

在前两周国外知名博客WDL先后分享了“2010最佳系列”中的“最佳免费 WordPress主题”和“最佳免费字体”,在这个 星期又发布了2010年最佳jQuery插件。在2010年,JavaScript框架继续日渐普及,这使得大量的插件被开发出来。满目琳琅,难以选择心 头之好。WDL的作者从大量的优秀jQuery插件精心筛选出一些对Web Designers有帮助的和具备非常不错的视觉效果的Best of the best。

2010年最佳jQuery插件 | iwanna.cn 我想网

2010年最佳jQuery插件(排名不分先后):

Nivo Slider

2010年最佳jQuery插件 | iwanna.cn 我想网

一个加载设置拥有9种过度效果的超级smooth slider,它还支持如链接图像和键盘导航等内容。
(全文 …)

, , 等等,这可不是你妈口中的AJAX

Web pages are written in HTML, the web programming language that tells browsers how to lay out and present content on a web page. In other words, HTML provides the basic building blocks for the web. For a long time, those building blocks were pretty simple and static: lines of text, links and images.

众所周知,网页是用超文本标记语言(HTML)编写的,这种网页编程语言告诉浏览器怎样在网页中输出并 展现内容。换句话说,HTML就是网页这个建筑的一砖一瓦。长期以来,这些“砖瓦“都相当简单而且是静态的:仅有几行文字,或一些链接,或几张图片。

Today, the web goes beyond just text, links, and images. We expect to be able to play online chess or seamlessly scroll around a map of our neighborhood, without waiting for the entire page to reload for every chess move or every map scroll.

而今,网页中远不止文本,链接 和图片了。我们期望能够在线下象棋时,每走一步不必等待网页重新加载,或者查看一下我们周边的地图时,每拖到一下网页也不用重新刷新。

The idea of such dynamic web pages began with the invention of the scripting language JavaScript. JavaScript support in major web browsers meant that web pages could incorporate more meaningful real- time interactions. For example, if you’ve filled out an online form and hit the “submit” button, the web page can use JavaScript to check your entries in real-time and alert you almost instantly if you had filled out the form wrongly.

这些动态网页的创意开始与于脚本语言JavaScript的出现。主要的 网页浏览器都支持JavaScript,这就意味着网页能够加入一些更有意义的实时互动。例如,当你在线填一些表格时,点击“提交“按钮,网页可以调用 JavaScript代码来实时检查表格是否填错,如果有错误,网页马上就能提示你。
(全文 …)