Visual jQuery1.1_word文档.doc.docVIP

目录 Core2 DOM13 CSS55 Javascript62 Effects69 Events76 Ajax99 Plugins114 jQuery是一款同prototype一样优秀js开发库类，特别是对css和XPath的支持，使我们写js变得更加方便！如果你不是个js高手又想写出优 秀的js效果，jQuery可以帮你达到目的！?? 下载地址：Starterkit （http://jquery.bassistance.de/jquery-starterkit.zip）?????????????????????? jQuery Downloads （/src/） ?? 下载完成后先加载到文档中，然后我们来看个简单的例子！ script?language=javascript?type=text/javascript???????$(document).ready(function(){????????$(a).click(function()?{????????alert(Hello?world!);???});});script ???? 上边的效果是点击文档中所有a标签时将弹出对话框，$(a) 是一个jQuery选择器，$本身表示一个jQuery类，所有$()是构造一个jQuery对象，click()是这个对象的方法，同理$(document)也是一个jQuery对象，ready(fn)是$(document)的方法，表示当document全部下载完毕时执行函数。???? 在进行下面内容之前我还要说明一点$(p)和$(#p)的区别,$(p)表示取所有p标签(p/p)的元素,$(#p)表示取id为p(span? id=p/span)的元素. 我将从以下几个内容来讲解jQuery的使用:1:核心部分2:DOM操作3:css操作4:javascript处理5:动态效果6:event事件 7:ajax支持 8:插件程序 ?????????????????????????????????????????????一：核心部分$(expr)说明：该函数可以通过css选择器，Xpath或html代码来匹配目标元素，所有的jQuery操作都以此为基础参数：expr：字符串，一个查询表达式或一段html字符串例子：未执行jQuery前： pone/pdiv????? ptwo/p/div??? pthree/p???? a?href=#?id=test?onClick=jq()?jQuery/ajQuery代码及功能： function?jq(){??????alert($(div??p).html());??} 运行：当点击id为test的元素时，弹出对话框文字为two，即div标签下p元素的内容 function?jq(){????$(divpHello/p/div).appendTo(body);} 运行：当点击id为test的元素时，向body中添加“divpHello/p/div”$(elem)说明：限制jQuery作用于一个特定的dom元素，这个函数也接受xml文档和windows对象参数： elem：通过jQuery对象压缩的DOM元素例子：未执行jQuery前： pone/p??div?????ptwo/p??/divpthree/pa?href=#?id=test?onClick=jq()jQuery/a jQuery代码及功能： function?jq(){????alert($(document).find(div??p).html());} 运行：当点击id为test的元素时，弹出对话框文字为two，即div标签下p元素的内容 function?jq(){???$(document.body).background(black);} 运行：当点击id为test的元素时，背景色变成黑色$(elems)说明：限制jQuery作用于一组特定的DOM元素参数： elem：一组通过jQuery对象压缩的DOM元素例子：未执行jQuery前： form?id=form1????? input?type=text?name=textfield????? input?type=submit?name=Submit?value=提交/forma?href=#?id=test?onClick=jq()jQuery/a jQuery代码及功能： function?jq(){????$(form1.elements?).hide();?} 运行：当点击id为test的元素时，隐藏form1表单中的所有元素。