JQuery 介绍

jQuery是我最近发现的一个新工具。jQuery开发团队形容jQuery是“一个快捷、简练的JavaScript库,它可以简化HTML文档检查、事件处理、动画执行、并给你的Web页面增加AJAX交互。”

jQuery初步

你可以免费下载jQuery 的最新版本。它由一个明确定义的脚本文件构成,因此你可以随意研究它的源代码。下载JavaScript文件后,你就可以把它放在Web服务器中准备使用。你可以用HTML SCRIPT元素把jQuery库加载到任何Web页面中。src属性应利用文件在服务器中的真实路径。

<script type="text/javascript"

src="jquery-latest.js"></script>

下载文件后,以下的一些任务会对你使用jQuery有所帮助。

编码基础

以下是使用jQuery编码时用到的一些指针:

* jQuery代码块前为美元符号($)。

* 美元符号后是一个左圆括号。

* 括号内是你要jQuery查找的内容,如它应使用哪个元素。

* 特定对象事件后为右圆括号。

* 你可以用指定的事件定义所发生的操作。方法/事件后的括号内是一个说明发生事件时会出现什么操作的函数。

在举例说明之前,我想介绍jQuery库的一个最有益的基础元素。JQuery利用的一切功能全都位于HTML DOM中,因此在你使用jQuery的特性之前,你必须加载这个文档。你可以用这个文档的ready事件完成上述操作,如下面的jQuery代码段所示:

$(document).ready(function() {

// Your code goes here

});

上面的简单jQuery代码允许你在文档完成加载后执行代码。列表A是它的一个应用实例,它对页面上的所有标题元素应用一个CSS类。

<html><head>

<title>Test</title>

<script type="text/javascript" src="jquery-latest.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$('h1').addClass("testclass");});

</script>

<style type="text/css" media="all">

.testclass { background: yellow; font-size: 20pt; }

</style>

</head>

<body>

<h1>Test</h1>

<p>test</p>

<h1>Test2</h1>

<p>test2</p>

</body></html>

这段代码中包含以下元素:

* $(document).ready(function(){——在页面完全加载后,告诉页面执行(函数主体内)的代码。

* $('h1').addClass("testclass");});——定位页面上的所有HTML H1元素。addClass方法将所有的testclass CSS类分配给H1元素。这个类设定一个黄色背景色,因此所有标题都为黄色背景。

http://www.qhwins.com/ShowNews/?16-200811171518414794.html