Recently in JavaScript Category

jQuery是当下网页设计师和开发人员所使用的最流行的Javascript库之一(除了HTML5和CSS3)。它是一种前端开发人员快速成长所必须具备的技能。

但想要学习jQuery的初学者,有时候很难找到专门学习jQuery的网站,在从初学者到专家的进化过程中,寻找jQuery资源是个相当大的挑战,它将耗费你大量的时间。

所以,在 Webdesigneraid,我们收集并列出了8个很棒的网站,你可以关注并且阅读他们的教程。这些网站将帮助你成为一个jQuery大牛。如果您认为除了我们列出的这几个网站之外还有很不错的网站,请不吝在下方回复。

1. Learning jQuery

1_preview_90_1.jpg
最好的jQuery资源博客之一,从jQuery高手身上学习。

1 Comment
TAG

本文转载自Speed's smart design,仅供参考以及从另外一个角度来了解jQuery,不代表本人认同其中的全部观点。

大部分情况下,我们面临的背景是:

设计者高高在上,不食人间烟火,只是提供约束,不要这样,必须那样,而不是提供方法和可以复用的API。

开发者是处于解决问题的一线,饱尝重复造轮子的疾苦,他们最需要的是快速的解决问题,以更恰当的方式工作,寻找更容易构建系统的技术和方式。

Jquery给设计者上了很好的一课,Jquery就像一个魔法师一样,$()就像魔法棒一样,随手一指,一个木偶变复活了,一瞬间具备了各种各样的复杂的能力。

1 Comment
TAG

此Javascript主要是用来获取客户端浏览器的相关讯息,以及所属的操作系统,范例从网络上摘抄整理。

透过navigator.userAgent来获取客户端讯息

var userAgent = navigator.userAgent.toLowerCase();
browser={
    windows: /windows/.test( userAgent ),
    version: (userAgent.match( /.+(?:rv|it|ra|ie|me|ox)[\/: ]([\d.]+)/ ) || [0,'0'])[1],
    chrome: /chrome/.test( userAgent ),
    safari: /webkit/.test( userAgent ) && !/chrome/.test( userAgent ),
    opera: /opera/.test( userAgent ),
    msie: /msie/.test( userAgent ) && !/opera/.test( userAgent ),
    mozilla: /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent )
}
1 Comment
TAG
,

在一些在线订阅网站订阅RSS时,都会显示被订阅网站的Favicon。Google很早就有提供一些这类的小工具,比如获取站点的Favicon,圆角图片生成代码等等,以前一直没有在Blog上记录,今天看到冰糖橙子的网站上面有提供一段js代码,于是想着还是记录下来的好。

本范例是使用jQuery来获取Google的Favicon缓存,如果有获取到该网站的Favicon则显示,如没有获取到,则会显示一个地球图标。

<script language="javascript">
$(document).ready(function(){
  $("ins.favicon").each(function(){
    var _url = $(this).attr("rel").replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' );
    var _imgurl = "http://www.google.com/s2/favicons?domain=" + _url;
    $(this).css({'background-image':'url("'+_imgurl+'")'})
  });
});
</script>
80 Comments
TAG
, ,

前端开发者有时候需要在一个网页内嵌入iFrame,并且要在加载完成时执行某些动作,那么如何判断该iFrame加载完成呢?Nicholas C. Zakas 文章《Iframes, onload, and document.domain》的评论中 Christopher 提供了一个新的判断方法

var iframe = document.createElement("iframe");
iframe.src = "http://www.planabc.net";

if (iframe.attachEvent){
    iframe.attachEvent("onload", function(){
        alert("Local iframe is now loaded.");
    });
} else {
    iframe.onload = function(){
        alert("Local iframe is now loaded.");
    };
}

document.body.appendChild(iframe);
1 Comment
TAG
正则表达式用于字符串处理、表单验证等场合,实用高效。现将一些常用的表达式收集于此,以备不时之需。

匹配中文字符的正则表达式: [\u4e00-\u9fa5]
评注:匹配中文还真是个头疼的事,有了这个表达式就好办了

匹配双字节字符(包括汉字在内):[^\x00-\xff]
评注:可以用来计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)

匹配空白行的正则表达式:\n\s*\r
评注:可以用来删除空白行
4 Comments
TAG

图表应用能让数据显示更加直观易懂,但光靠CSS+XHTML或纯图片实现的图表显然有很多局限性,强大的jQuery让我们可以实现各种很强大的图表,下面是6款jQuery图表插件

1. Flot

Flot_1.png
从交互性的层面来说,jQuery实现的 Flot图表和Flash实现的图表效果已经是非常的接近。图表输出效果相当的流畅光滑,注重视觉效果。你也可以和data points数据节点配合使用,当鼠标hover到某个数据节点时,会得到对应节点的数值说明内容的反馈信息。

5 Comments
TAG
, ,

作者:Andrea Ercolino

In IE the window resize event is fired multiple times per actual resize: it is a well known issue for IE6 and IE7, but they misbehave along different patterns. Actually it seems that IE6 is worse than IE7.

After quite a long session of R&D, I've got to a pretty good solution, in the form of a jQuery plugin:

jquery.wresize.js(作者网站的原插件地址在此)。

5 Comments
TAG
, ,

这个说明里面说的是一些基础的DOM方法。在下偶尔也有用用Javascript写一些自己用的效果,都是根据需要而做的代码片段,不成气候。

这里说的是实现一些动态地获取、新建、控制HTML的方法,在Javascript应用中,应该是相当常见的,你看我这个JS小菜都会用到:)包括getElementById(id)、getElementByName(name)、getElementsByTagName(tagname)、appendChild(node)、removeChild(childreference)、cloneNode(deepBoolean)、replaceChild(newChild,oldChild),第二部分(明天)再发出来,有关insertBefore(newElement,targetElement)、childeNodes等相关资料。

在这里首先记录一下,Javascript中是区别大小写的,另外,Javascript不是JAVA Script。

3 Comments
TAG
,

原译文:你真的会写JavaScript吗? 

文章的开头很有意思,作者写到他和一个据说已经写了快4年JavaScript的女程序员聊天,女程序员认为她的JS水平very good,后来作者发现她确实会写,但仅仅是会写,其实对JavaScript的内涵所知甚少。

作者想用这个例子说明,有很多具备Java/C++/C#开发经验的开发人员在编写JavaScript或者转行到FED(比如我)的时候,想当然的把那些标准面向对象语言的思想套用在JavaScript上,反而走入迷途。

原文: JavaScript, We Hardly new Ya  --Douglas Crockford。 

JavaScript是一门基于原型的语言,但它却拥有一个 new 操作符使得其看起来象一门经典的面对对象语言。那样也迷惑了程序员们,导致一些有问题的编程模式。

2 Comments
TAG
最新图片
  • realistic-css3-buttons.gif
  • 20110420224155706.png
  • 20110420223729064.png
  • 20110420223523394.png
  • 20110420223056249.png
  • nice-css3-buttons.gif
  • 20110420222416083.png
  • 20110420222001003.png
  • 20110420221520749.png
  • 20110420220814359.png
  • github-style-css3-buttons.gif
  • 20110420215722032.png
网站统计

Copyright © 2006~2010 肆无忌惮. All rights reserved. 关于本站 | 版权声明 | 免责条款 | 相关法规 | 网站统计

Powered by MTOS. 所有的文本内容在GNU自由文档许可证下发布