当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 初学者全面接触学习jquery(译文)

Javascript
QQ邮箱的一个文本编辑器代码
Z-Blog中用到的js代码
绝对经典的滑轮新闻显示(javascript+css)实现
用js实现的仿sohu博客更换页面风格(简单版)
仿Vista进程条效果
用Javascript判断图片是否存在,不存在则显示默认图片的代码
用JQuery 实现的自定义对话框
jQuery使用手册之三 CSS操作
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
贴图转换+转贴工具用到的js代码超级推荐
超级简单的图片防盗(HTML),好用
现代 javscript 编程 资料
超级可爱纯js网页时钟
Dojo之路:如何利用Dojo实现Drag and Drop效果
AJAX架构之Dojo篇
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
使用prototype.js 的时候应该特别注意的几个问题.
一个已封装好的漂亮进度条
漂亮的widgets,支持换肤和后期开发新皮肤
用javascript实现的仿Flash广告图片轮换效果

Javascript 中的 初学者全面接触学习jquery(译文)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 359 ::
收藏到网摘: n/a

原文地址:http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

最好有javascript以及dom方面的知识,这对于理解其中的代码很有帮助,不了解也不要紧,因为代码本身就很简洁。

这篇指南包括了 hello jquery、基本的selector、event、ajax、FX、以及一些插件。

tips:当你看到这篇文章时最好在第一时间看完,不要放到收藏夹里等待将来的某天再翻出来看,往往这一天不会到来。

其实在我之前已经有人翻译了这篇文章,但是我觉得翻译得有点粗糙,不易阅读,因此又重新翻译了一下,对我自己也又温习了一下jquery。

OK!出发了

  1. Setup
  2. Hello jQuery
  3. Find me: Using selectors and events //定位
  4. Rate me: Using Ajax //投票
  5. Animate me: Using Effects //动画
  6. Sort me: Using the tablesorter plugin //排序
  7. Plug me: Writing your own Plugins //插件
  8. Next steps

Setup(安装)

下载地址:http://docs.jquery.com/Downloading_jQuery
得到jquery.js后,将其包含到目标文件就可以了,就像这样

  1. $(document.ready(function() {
  2.    // do stuff when DOM is ready
  3.  });

当dom都加载完后执行里面的语句,类似于window.onload。
那么载入完成后,我们来做些事情。

  1. $(document.ready(function() {
  2.    $("a".click(function() {
  3.      alert("Hello jQuery!";
  4.    });
  5.  });

当点击任何一个链接时,都会弹出一个框,里面是什么内容,就不用我说了吧。
我们来品品这几句话,首先是”$()”,这个可以当作一个选择器,里面可以是tagName,比如例子中的”a”,还可以是什么,我们下面再说。
然后是一个click方法,相当于在每一个链接里都加了一句”onclick=…”,从这里可以看出jQuery的一个很大的优点就是代码和结构分离。