http://www.ijavascript.cn/jquery/jquery-tutorial-13.html
jquery基本教程之简单体验
Jquery是继prototype之后又一个优秀的Javascript框架。对prototype我使用不多，简单了解过。但使用上jquery之后，马上被她的优雅吸引住了。有人使用这样的一比喻来比较prototype和jquery：prototype就像Java，而jquery就像 ruby.实际上我比较喜欢java（少接触Ruby罢了）但是jquery的简单的实用的确有相当大的吸引力啊！在项目里我把jquery作为自已唯一的框架类包。使用其间也有一点点心得，其实这些心得，在jquery的文档上面也可能有讲，不过还是记下来，以备忘罢。
一，找到你了！
还记得$()这个东西吧？prototype还是DWR都使用了这个函数代替document.getElementById()。没错，jquery也跟风了。为达到document.getElementById()的目的，jquery是这样写的：
var someElement = $("#myId");
看起来比其他两个框架的要多了一个#，好，看看下面的用法：
$("div p");(1)
$("div.container")(2)
$("div #msg");(3)
$("table a",context);(4)
在 prototype里看过这样的写法吗？第一行代码得到所有<div>标签下的<p>元素。第二行代码得到class为 container的<div>元素,第三行代码得到<div>标签下面id为msg的元素。第四行代码得到context为上下文的table里面所有的连接元素。
如果你熟悉CSS，Xpath，你会觉得这些写法很眼熟！对了。正是。看出奥妙了吧。jquery就是通过这样的方式来找到Dom对象里面的元素。跟CSS的选择器相类似。
二，Jquery对象？
jquery提供了很多便利的函数，如each(fn)，但是使用这些函数的前提是：你使用的对象是Jquer对象。使一个Dom对象成为一个Jquery对象很简单，通过下面一些方式（只是一部分）：
var a = $("#cid");(1)
var b = $("<p>hello</p>");(2)
var c = document.createElement("table"); var tb = $(c);
三，代替body标签的onload
这个惯例，也许是除了$()之外，用得最多的地方了。下面一段代码：
$(document).ready(function(){
alert("hello");
});(1)
<body onload="alert('hello');">（2）
上面两段代码是等价的。但代码1的好处是做到表现和逻辑分离。并且可以在不同的js文件中做相同的操作，即$(document).ready(fn)可以在一个页面中重复出现，而不会冲突。基本上Jqeury的很多plugin都是利用这个特性，正因为这个特性，多个plugin共同使用起来，在初始化时不会发生冲突。
不管怎么说，这个惯例可以分离javascript与HTML。推荐使用。
四，事件机制
我大量使用的事件可能就是button的onclick了。以前习惯在input 元素上写onclick = "fn()",使用jquery可以使javascript代码与html代码分离，保持HTML的清洁，还可以很轻松地绑定事件，甚至你可以不知道“事件”这个名词。
$(document).ready(function(){
$("#clear").click(function(){
alert("i am about to clear the table");
});
$("form[0]").submit(validate);
});
function validate(){
//do some form validation
}
五，同一函数实现set&get
$("#msg").html();
$("#msg").html("hello");
上面两行代码，调用了同样的函数。但结果却差别很大。
第一行是返回指定元素的HTML值，第二行则是将hello这串字符设置到指定元素中。jquery的函数大部分有这样的特性
六，ajax
这是一个ajax横行的时代。多少人，了不了解ajax的都跟着用上一把。呵。使用jquery实现ajax同样简单异常
$.get("search.do",{id:1},rend);
function rend(xml){
alert(xml);
} (1)
$.post("search.do",{id:1},rend);
function rend(xml){
alert(xml);
} (2)
$("#msg").ajaxStart(function(){
this.html("正在加载。。。。");
});(3)
$("#msg").ajaxSuccess(function(){
this.html("加载完成！");
});(4)
这些都是较常用的方法，get和post用法一样。第一个参数是异步请求的url，第二个为参数，第三个回调方法。
3，4的方法会在指定的Dom对象上绑定响应ajax执行的事件。当然，jquery的AJAX相关的函数不仅是这些，有兴趣可以去研究再多。
七，渐入淡出
$("#msg").fadeIn("fast");
$("#msg").fadeOut("slow");
没错，上面两行代码已经分别实现了一个id为Msg的jquery对象的渐入和淡出。做一个像Gmail一样的动态加载通知条，用jquery就那么简单。两个函数接受的参数除了快慢等，还可以接收整型，作为渐入或淡出的完成时间，单位为MS。
八，plugin
这也是一个插件的时代。
jquery插件给我的感觉清一色的清洁，简单。如Jtip，要使用它的功能，只需要在你的元素的class上加上Jtip,并引入jtip.js及其样式即可以了。其他事情插件全包。我喜欢jquery的一个重要原因是发现她已经有了很多很好，很精彩的插件。
写得很烂。可能大家看不出jquery的好处。嗯，光听是没用的，试用一下吧。你会发觉很有趣。
暂时告一段落吧。待有新的发现再来分享。
分享到：
相关推荐
**jQuery基础教程中文版2015** jQuery是一款强大的JavaScript库，它简化了HTML文档遍历、事件处理、动画设计和Ajax交互等任务。2015年发布的这个基础教程，旨在帮助初学者快速掌握jQuery的核心概念和技术。 一、...
《jQuery基础教程第四版》是一本深受欢迎的前端开发指南，专注于jQuery库的使用和实践。jQuery是一个轻量级、高性能的JavaScript库，它极大地简化了JavaScript操作DOM（文档对象模型）、事件处理、动画制作以及Ajax...
以下是关于jQuery基础教程第5章的一些核心知识点： 1. **选择器**：jQuery的选择器基于CSS，允许开发者轻松地选取DOM中的元素。如`$("#id")`用于选取ID为"id"的元素，`$(".class")`用于选取所有class为"class"的...
《jQuery基础教程（第四版）中文pdf版+配套源码》是针对JavaScript库jQuery的一份详细学习资源，旨在帮助初学者和进阶开发者掌握jQuery的核心概念和技术。jQuery是一款广泛使用的JavaScript库，它简化了HTML文档遍历...
学习jQuery的基础教程，不仅可以掌握基本操作，还能了解到如何利用jQuery插件扩展功能，如表单验证、图片轮播、模态对话框等。通过实践这些源代码，开发者能够快速上手并运用到自己的项目中，提升开发效率。 总之，...
通过阅读《jQuery基础教程（第四版）中文》，读者不仅能掌握jQuery的基本用法，还能了解最佳实践和最新趋势。配合提供的"教程重要说明及更新链接点击这个文本.txt"，读者可以获取最新的教学资源和更新信息。"jQuery...
《jQuery基础教程（第二版）源码》是一个用于学习jQuery库的配套资源，包含了多个章节的实例代码。jQuery是一款广泛使用的JavaScript库，它简化了HTML文档遍历、事件处理、动画设计和Ajax交互等任务。这个教程源码...
JQuery基础教程之第五章后面章节请看我后续资源jquery全套教程： JQuery基础教程之前言和前三章:http://download.csdn.net/source/745869 JQuery基础教程之第四章:http://download.csdn.net/source/745907 JQuery...
jQuery基础教程.pdf jQuery基础教程.pdf
### jQuery基础教程知识点详解 #### 一、jQuery技术框架概览 **1.1 jQuery的起源与发展** - **创建者**: John Resig在2006年初创建了jQuery。 - **最新版本**: 截至资料所述时，最新版本为1.3.2。 - **官方...
《jQuery基础教程第四版》是一本专为初学者设计的指南，旨在帮助读者掌握JavaScript库jQuery的核心概念和技术。jQuery简化了HTML文档遍历、事件处理、动画制作以及Ajax交互等任务，是Web开发中广泛使用的工具。这...
JQuery基础教程之第七章后续章节看我后续资源jquery全套教程： JQuery基础教程之前言和前三章:http://download.csdn.net/source/745869 JQuery基础教程之第四章:http://download.csdn.net/source/745907 JQuery基础...
### jQuery基础教程（第四版）知识点总结 #### 一、jQuery简介与背景 - **诞生时间**：2006年1月14日 - **创始人**：John Resig，一位年轻的80后程序员 - **背景**： - 在jQuery诞生之前，已经有像Dojo和...
在《jQuery基础教程第二版》中，读者将学会如何使用jQuery提供的Ajax方法，实现无刷新的数据交互，极大地提升了用户体验。这包括了GET和POST请求的发送、跨域请求的处理以及与JSON数据格式的交互等。 除了这些基础...
**jQuery基础教程（第二版）** jQuery是一款广泛应用于Web开发的JavaScript库，它极大地简化了JavaScript的使用，尤其是处理HTML文档、事件处理、动画效果以及AJAX交互。本教程将深入探讨jQuery的核心概念和功能，...
**jQuery基础教程(高清中文版PDF)** 这本由Jonathan Chaffer和Karl Swedberg编写的《jQuery基础教程》是国外备受推崇的经典著作，它深入浅出地讲解了jQuery库的基础知识，对于想要掌握JavaScript前端开发的人员来说...
**jQuery基础教程第四版**是针对初学者设计的一本深入浅出的指南，它全面讲解了jQuery库的核心概念和实用技巧。jQuery是一个广泛使用的JavaScript库，它的主要目标是简化HTML文档遍历、事件处理、动画制作和Ajax交互...
JQuery基础教程之第八章后续章节看我后续资源jquery全套教程： JQuery基础教程之前言和前三章:http://download.csdn.net/source/745869 JQuery基础教程之第四章:http://download.csdn.net/source/745907 JQuery基础...