通过这个例子可以对jQuery的使用有个基本的认识，jQuery的事件句柄、选择器、基本语法结构，你可以复制这些代码运行感受一下。
在做第一个例子之前，你需要先到jQuery 1.3 正式版 下载 jQuery库，他是一个js的文件非常的小巧只有那么几十KB，然后就是把这个文件Copy到你的项目，用Script附加这个文件就可以了。
Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="jquery.js" type="text/javascript"></script>
<style type="text/css">
.red
{
background-color: Red;
}
.green
{
background-color: Green;
}
.blue
{
background-color: Blue;
}
</style>
<script type="text/javascript">
$(document).ready(
function() {
$("div").addClass("blue");
//$("#olID>li").addClass("green");
$("#olID>li").hover(
function() {
$(this).addClass("red")
},
function() {
$(this).removeClass("red")
});
$("#olID>li:last").hover(
function() {
$(this).addClass("green");
},
function() {
$(this).removeClass("green");
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ol id="olID">
<li>Terry.Feng.C</li>
<li>冯瑞涛</li>
<li>dddd.com</li>
</ol>
</div>
</form>
</body>
</html>
分享到：
相关推荐
锋利的jquery小例子
jquery行列合并例子 版本：jquery-1.3.2.min.js
这是一些jQuery livequery的小例子源码演示，我想对学习livequery是有一定帮助的，实例中一共包括三个演示文件： 第一个演示：livequery导致的超链接点击; 第二个演示：livequery匹配rel属性值中含有"friend"的A...
《锋利的jQuery第2版》仅在内容方面进行了更新，而且还在上一版的基础上做了大量的修订和扩展。涵盖了如下几个方面。 例子全部改用最新的jQuery库。 例子使用了全新的UI，并且代码更符合语义化。 修订了上一版已...
才看了《spring 3.x》第一章内容，写的一个例子；感觉写得挺经典的。 于是骄傲地分享出来。 除了隐藏jdbc.properties里配置；其余都无保留的分享出来了。这里其实一个关于分库分表的配置文件。 使用技术细节：...
第一个jqGrid例子 第一个jqGrid例子 第一个jqGrid例子
Jquery起点教程，jquery基础语法、例子，很详细..
2012-7出版的《锋利的jQuery第2版》在原有的版本基础上增加了，如下内容： 例子全部改用最新的jQuery库。 例子使用了全新的UI，并且代码更符合语义化。 修订了上一版已发现的所有印刷错误。 增加了jQuery Mobile的...
为使读者更好地进行开发实践，《锋利的jQuery(第2版)》的第8章将前7章讲解的知识点和效果进行了整合，打造出一个非常有个性的网站，并从案例研究、网站材料、网站结构、网站样式和网站脚本等方面指导读者参与到项目...
《锋利的jQuery第2版》仅在内容方面进行了更新，而且还在上一版的基础上做了大量的修订和扩展。涵盖了如下几个方面。 例子全部改用最新的jQuery库。 例子使用了全新的UI，并且代码更符合语义化。 修订了上一版已...
1.1.4 编写第一个简单的jQuery应用/3 1.1.5 jQuery程序的代码风格/5 1.2 jQuery的简单应用/7 1.2.1 jQuery访问DOM对象/7 1.2.2 jQuery控制DOM对象/7 1.2.3 jQuery控制页面CSS /9 1.3 本章小结/11 第2章 ...
jQuery 1.0（2006年8月）：该库的第一个稳定版本，已经具有了对CSS选择符、事件处理和AJAX交互的稳健支持。 jQuery 1.1（2007年1月）：这一版大幅简化了API。许多较少使用的方法被合并，减少了需要掌握和解释的...
jquery selector: 以 content 指定的 jquery selector 筛选出第一个 jquery 对象的 HTML 文本. c. url: 以 iframe 加载 content 页面内容. 调用例子: $.modalbox.show({ modal: true, // 模态 contentType: ...
也就是说，已经得到了一个jQuery对象，但是并不是想要的，那么可以通过一系列的跳转方法，比如parent()、next()、children()、find()等，或者过滤筛选的方法，比如eq()、filter()、not()等，来得到最终想要操作的...
$("ul li:first") 每个 <ul> 的第一个 <li> 元素 $("[href$='.jpg']") 所有带有以 ".jpg" 结尾的属性值的 href 属性 $("div#intro .head") id="intro" 的 <div> 元素中的所有 class="head" 的元素 三. jQuery 事件...
《锋利的jQuery第2版》仅在内容方面进行了更新，而且还在上一版的基础上做了大量的修订和扩展。涵盖了如下几个方面。 例子全部改用最新的jQuery库。 例子使用了全新的UI，并且代码更符合语义化。 修订了上一版...
第一部分：鼠标交互 1.1 Draggables:拖拽 所需文件： ui.mouse.js ui.draggable.js ui.draggable.ext.js 用法：文件载入后，可以拖拽class = "block"的层 $(document).ready(function(){ $(".block")....
Source map就是一个信息文件，里面储存着位置信息。转换后的代码的每一个位置，所对应的转换前的位置。 有了它，出错的时候，除错工具将直接显示原始代码，而不是转换后的代码。这无疑给开发者带来了很大方便。 目前...
一共2个例子,比较简单,第一个用java片写的,不需要添加任何的jar包,第二个用jstl写的,需要用2个jar 包, 没有使用struts的标签. 使用很简单,index.jsp 调用admin.jsp 和pagination.jsp. 用一个java bean,需要引用一下 ...
资源名称：jQuery 七天入门指南内容简介：jQuery 初级教程——七天入门指南中文版， pdf高清淅版，翻译加实例，学习jQuery的第一手资料，jQuery的起点教程，书中的内容涉及以实例为基础一步步说明了jQuery的工作方式...