jQuery 学习体验
昨天从文超那了解到JavaScript脚本中有一个javascript库叫：jQuery；我对这个东东蛮有兴趣的，所以现在抽点时间 学习一下，并记录一下自己的体验心得：
首先了解一下jQuery:
jQuery 是一个新型的JavaScript库.
jQuery是一个简洁快速的JavaScript库，它能让你在你的网页上简单的操作文档、处理事件、运行动画效果或者添加Ajax交互。jQuery的设计会改变你写JavaScript代码的方式。
jQuery是一个轻量级的脚本，其代码非常小巧，JavaScript包只有15K左右。
jQuery支持CSS1-CSS3,以及基本的xPath(xPath是什么呢？)
jQuery是跨浏览器的，它支持的浏览器包括IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+
注：xPath:为XML路径语言（XML Path Language），它是一种用来确定XML文档中某部分位置的语言。(详细参考http://zh.wikipedia.org/wiki/XPath)
==========================================================================================
1、ready函数
格式：
$(document).ready(function()
{
//当文档载入后从此处开始执行代码
});
说明：
$(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。这是事件模块中最重要的一个函数，因为它可以极大地提高web应用程序的响应速度。
$(document).ready表示：获取文档对象就绪的时候。
注：DOM：是Document Object Model文档对象模型的缩写
2、鼠标点击事件
格式：$("div/#id/.class").click(function()
{
//事件效果代码，每个事件结束后用分号结束语句。
})
$(div/#id/.class)表示事件发生在当前页面的所有层/同名id/同名类都绑定了**事件，若用this表示返回当前对象
例子：点击文字那一层，出现提示信息：这是我的第一个jQuery例子！！！
<html>
<head>
<title>第一个jQuery例子</title>
</head>
<script language="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>
<script language="javascript">
<!--
$(document).ready(function()
{
$("div").click(function()
{
alert("这是我的第一个jQuery例子！！！");
})
})
-->
</script>
<body>
<div>
点击这些文字看会出现什么效果……
</div>
</body>
</html>
不明地方： <script language="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>
这句语句做何解释，为什么没有这句时，点击文字不会出现提示信息？
3、对CSS 的操作方法：addclass & removeclass
addclass:添加指定层的样式类名
removeclass:移除指定层的样式类名
格式： $("div/#id/.class").addClass("样式类名");
$("div/#id/.class/this").removeClass("样式类名");
例子：
<script language="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>
<style>
.a { background-color:#00FF66}
</style>
<script language="javascript">
<!--
$(document).ready(function()
{
$("div").addClass("a");//加载网页时添加样式
$("div").click(function()
{
$(this).removeClass("a");//鼠标点击时触发绑定的click事件
})
})
-->
</script>
<body>
<div>
点击我看看，是不是有变化呢？
</div>
</body>
注：addClass & removeClass 中的Class中的C一定要大写，否则看不出效果！！！
==========================================================================================
4、css\height\width
格式：1) css(key,value) 2) css(name) 3) css(properties)
height(value)
width(value)
说明:css(key,value) key:标记类名或ID名 value:属性值
css(name) name:标记类名或ID名
css(properties) properties:把一个“名/值对”对象设置为所有匹配元素的样式属性。
例子：
<script language="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>
<script language="javascript">
<!--
$(document).ready(function()
{
$("#bb").click(function()
{
$(this).css("background","#0033FF");
alert($(this).css("background"));
})
$("#b").click(function()
{
$(this).css({ background: "#33FF00", height:"100px" });
})
$("#h").click(function()
{
$(this).css("background","#0033ff");
$(this).height("200px");
$(this).width("300px");
})
})
-->
</script>
<div id="bb">
css(key,value);
css(name);
</div>
<div id="b">
css(properties);
</div>
<div id="h">
height,width;
</div>
