知识大全 JQuery框架介绍

Posted 2022-07-14 函数

篇首语：非淡泊无以明志，非宁静无以致远。本文由小常识网(cha138.com)小编为大家整理，主要介绍了知识大全 JQuery框架介绍相关的知识，希望对你有一定的参考价值。

JQuery框架介绍 以下文字资料是由(全榜网网www.cha138.com)小编为大家搜集整理后发布的内容，让我们赶快一起来看一下吧！

　　jQuery是一款同prototype一样优秀js开发库类特别是对css和XPath的支持使我们写js变得更加方便！如果你不是个js高手又想写出优秀的js效果 jQuery可以帮你达到目的！下载地址 Starterkit （ starterkit zip） jQuery Downloads （）下载完成后先加载到文档中然后我们来看个简单的例子！<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的使用: :核心部分 :DOM操作 :css操作 :javascript处理 :动态效果 :event事件 :ajax支持 :插件程序 一核心部分$(expr)说明该函数可以通过css选择器 Xpath或代码来匹配目标元素所有的jQuery操作都以此为基础参数 expr 字符串一个查询表达式或一段字符串例子未执行jQuery前 <p>one</p><div> <p>o</p></div> <p>three</p> <a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($( div > p l()); 运行当点击id为test的元素时弹出对话框文字为o 即div标签下p元素的内容function jq() $( <div><p>Hello</p></div> ) appendTo( body );运行当点击id为test的元素时向body中添加 <div><p>Hello</p></div> $(elem)说明限制jQuery作用于一个特定的dom元素这个函数也接受xml文档和windows对象参数 elem 通过jQuery对象压缩的DOM元素例子未执行jQuery前 <p>one</p> <div> <p>o</p> </div><p>three</p><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($(document) find( div > p l());运行当点击id为test的元素时弹出对话框文字为o 即div标签下p元素的内容function jq() $(document body) background( black );运行当点击id为test的元素时背景色变成黑色$(elems)说明限制jQuery作用于一组特定的DOM元素参数 elem 一组通过jQuery对象压缩的DOM元素例子未执行jQuery前 <form id= form > <input type= text name= textfield > <input type= submit name= Submit value= 提交 ></form><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $(form elements ) hide(); 运行当点击id为test的元素时隐藏form 表单中的所有元素 $(fn)说明 $(document) ready()的一个速记方式当文档全部载入时执行函数可以有多个$(fn)当文档载入时同时执行所有函数！参数 fn (Function):当文档载入时执行的函数！例子 $( function() $(document body) background( black );)运行当文档载入时背景变成黑色相当于onLoad $(obj)说明复制一个jQuery对象参数 obj (jQuery): 要复制的jQuery对象例子未执行jQuery前 <p>one</p><div> <p>o</p></div><p>three</p><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() var f = $( div ); alert($(f) find( p l()) 运行当点击id为test的元素时弹出对话框文字为o 即div标签下p元素的内容 each(fn)说明将函数作用于所有匹配的对象上参数 fn (Function): 需要执行的函数例子未执行jQuery前 <img src= jpg /><img src= jpg /><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( img ) each(function() this src = jpg ; );运行当点击id为test的元素时 img标签的src都变成了 jpg eq(pos)说明减少匹配对象到一个单独得dom元素参数 pos (Number): 期望限制的索引从开始例子未执行jQuery前 <p>This is just a test </p><p>So is this</p><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($( p ) eq(l())运行当点击id为test的元素时 alert对话框显示 So is this 即第二个<p>标签的内容get() get(num)说明获取匹配元素 get(num)返回匹配元素中的某一个元素参数 get (Number): 期望限制的索引从开始例子未执行jQuery前 <p>This is just a test </p><p>So is this</p><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($( p ) get( ) innerHTML);运行当点击id为test的元素时 alert对话框显示 So is this 即第二个<p>标签的内容注意get和eq的区别 eq返回的是jQuery对象 get返回的是所匹配的dom对象所有取$( p ) eq( )对象的内容用jQuery方法() 而取$( p ) get( )的内容用innerHTMLindex(obj)说明返回对象索引参数 obj (Object): 要查找的对象例子未执行jQuery前 <div id= test ></div><div id= test ></div><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($( div ) index(document getElementById( test ))); alert($( div ) index(document getElementById( test )));运行当点击id为test的元素时两次弹出alert对话框分别显示 size() Length说明当前匹配对象的数量两者等价例子未执行jQuery前 <img src= test jpg /><img src= test jpg /><a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($( img ) length);运行当点击id为test的元素时弹出alert对话框显示表示找到两个匹配对象

二 DOM操作属性我们以<img id= a scr= jpg />为例在原始的javascript里面可以用var o=document getElementById( a )取的id为a的节点对象在用o src来取得或修改该节点的scr属性在jQuery 里$( #a )将得到jQuery对象[ <img id= a scr= jpg /> ] 然后可以用jQuery提供的很多方法来进行操作如$( #a ) scr()将得到 jpg $( #a ) scr( jpg )将该对象src属性改为 jpg 下面我们来讲jQuery提供的众多jQuery方法方便大家快速对DOM对象进行操作herf() herf(val)说明对jQuery对象属性herf的操作例子未执行jQuery前<a id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() alert($( #test ) href()); $( #test ) href( l );运行先弹出对话框显示id为test的连接url 在将其url改为l 当弹出对话框后会看到转向到l同理 jQuery还提供类似的其他方法大家可以分别试验一下 herf() herf(val) () (val) id() id (val) name() name (val) rel() rel (val)src() src (val) title() title (val) val() val(val)操作after() 在匹配元素后插入一段<a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( #test ) after( <b>Hello</b> ); 执行后相当于 <a # id= test onClick= jq() >jQuery</a><b>Hello</b>after(elem) after(elems) 将指定对象elem或对象组elems插入到在匹配元素后<p id= test >after</p><a # onClick= jq() >jQuery</a>jQuery代码及功能function jq() $( a ) after($( #test )); 执行后相当于<a # onClick= jq() >jQuery</a><p id= test >after</p>append()在匹配元素内部且末尾插入指定<a # id= test onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( #test ) append( <b>Hello</b> ); 执行后相当于<a # onClick= jq() >jQuery<b>Hello</b></a>同理还有append(elem) append(elems) before() before(elem) before(elems)请执行参照append和after的方来测试理解！appendTo(expr) 与append(elem)相反<p id= test >after</p><a # onClick= jq() >jQuery</a>jQuery代码及功能function jq() $( a ) appendTo ($( #test )); 执行后相当于<p id= test >after<a # onClick= jq() >jQuery</a> </p>clone() 复制一个jQuery对象<p id= test >after</p><a # onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( #test ) clone() appendTo($( a )); 复制$( #test )然后插入到<a>后执行后相当于<p id= test >after</p><a # onClick= jq() >jQuery</a><p id= test >after</p>empty() 删除匹配对象的所有子节点<div id= test > <span>span</span> <p>after</p></div><a # onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( #test ) empty(); 执行后相当于<div id= test ></div><a # onClick= jq() >jQuery</a>insertAfter(expr) insertBefore(expr) 按照官方的解释和我的几个简单测试insertAfter(expr)相当于before(elem) insertBefore(expr)相当于after (elem)prepend () prepend (elem) prepend (elems) 在匹配元素的内部且开始出插入通过下面例子区分append(elem) appendTo(expr) prepend (elem)<p id= a >p</p><div>div</div>执行$( #a ) append($( div )) 后相当于<p id= a > P <div>div</div></p>执行$( #a ) appendTo($( div )) 后相当于<div> div <p id= a >p</p></div>执行$( #a ) prepend ($( div )) 后相当于<p id= a > <div>div</div> P</p>remove() 删除匹配对象注意区分empty() empty()移出匹配对象的子节点 remove() 移出匹配对象wrap() 将匹配对象包含在给出的代码内<p>Test Paragraph </p> <a # onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( p ) wrap( <div class= wrap ></div> ); 执行后相当于<div class= wrap ><p>Test Paragraph </p></div>wrap(elem) 将匹配对象包含在给出的对象内<p>Test Paragraph </p><div id= content ></div><a # onClick= jq() >jQuery</a>jQuery代码及功能 function jq() $( p ) wrap( document getElementById( content ) );执行后相当于<div id= content ><p>Test Paragraph </p></div>遍历组合add(expr) 在原对象的基础上在附加符合指定表达式的jquery对象<p>Hello</p><p><span>Hello Again</span></p><a # onClick= jq() >jQuery</a>jQuery代码及功能 function jq() var f=$( p ) add( span ); for(var i= ;i < $(f) size();i++) alert($(f) eq(l());执行$( p )得到匹配<p>的对象有两个 add( span )是在( p )的基础上加上匹配<span >的对象所有一共有个从上面的函数运行结果可以看到$( p ) add( span )是个对象的集合分别是[<p> Hello</p>] [<p><span>Hello Again</span></p>] [<span>Hello Again</span>] add(el) 在匹配对象的基础上在附加指定的dom元素 $( p ) add(document getElementById( a ));add(els) 在匹配对象的基础上在附加指定的一组对象 els是一个数组 <p>Hello</p><p><span>Hello Again</span></p>jQuery代码及功能 function jq() var f=$( p ) add([document getElementById( a ) document getElementById( b )]) for(var i= ;i < $(f) size();i++) alert($(f) eq(l());注意els是一个数组这里的[ ]不能漏掉 ancestors () 一依次以匹配结点的父节点的内容为对象根节点除外（有点不好理解看看下面例子就明白了）<div> <p>one</p> <span> <u>o</u> </span></div>jQuery代码及功能 function jq() var f= $( u ) ancestors(); for(var i= ;i < $(f) size();i++) alert($(f) eq(l());第一个对象是以<u>的父节点的内容为对象 [ <u>o</u> ]第一个对象是以<u>的父节点的父节点（div）的内容为对象 [<p>one</p><span><u>o</u></span> ]一般一个文档还有<body>和<> 依次类推下去 ancestors (expr) 在ancestors（）的基础上之取符合表达式的对象如上各例子讲var f改为var f= $( u ) ancestors( div ) 则只返回一个对象 [ <p>one</p><span><u>o</u></span> ]children() 返回匹配对象的子介点<p>one</p><div id= ch > <span>o</span></div>jQuery代码及功能 function jq() alert($( #ch ) children(l());$( #ch ) children()得到对象[ <span>o</span> ] 所l()的结果是 o children(expr) 返回匹配对象的子介点中符合表达式的节点<div id= ch > <span>o</span> <span id= sp >three</span></div>jQuery代码及功能function jq() alert($( #ch ) children( #sp l());$( #ch ) children()得到对象[<span>o</span><span id= sp >three</span> ] $( #ch ) children( #sp )过滤得到[<span id= sp >three</span> ]parent () parent (expr)取匹配对象父节点的参照children帮助理解contains(str) 返回匹配对象中包含字符串str的对象<p>This is just a test </p><p>So is this</p>jQuery代码及功能 function jq() alert($( p ntains( test l());$( p )得到两个对象而包含字符串 test 只有一个所有$( p ntains( test )返回 [ <p>This is just a test </p> ]end() 结束操作返回到匹配元素清单上操作前的状态 filter(expr) filter(exprs) 过滤现实匹配符合表达式的对象 exprs为数组注意添加 [ ] <p>Hello</p><p>Hello Again</p><p class= selected >And Again</p>jQuery代码及功能 function jq() alert($( p ) filter( selected l())$( p )得到三个对象 $( p ntains( test )只返回class为selected的对象 find(expr) 在匹配的对象中继续查找符合表达式的对象<p>Hello</p><p id= a >Hello Again</p><p class= selected >And Again</p>Query代码及功能 function jq() alert($( p ) find( #a l())在$( p )对象中查找id为a的对象 is(expr) 判断对象是否符合表达式返回boolen值<p>Hello</p><p id= a >Hello Again</p><p class= selected >And Again</p>Query代码及功能 function jq() alert($( #a ) is( p ));在$( #a )是否符合jquery表达式大家可以用$( #a ) is( div ); ( #a ) is( #a )多来测试一下next() next(expr) 返回匹配对象剩余的兄弟节点<p>Hello</p><p id= a >Hello Again</p><p class= selected >And Again</p>jQuery代码及功能function jq() alert($( p ) next(l()); alert($( p ) next( selected l());$( p ) next()返回 [ <p id= a >Hello Again</p> <p class= selected >And Again</p> ]两个对象$( p ) next( selected)只返回 [<p class= selected >And Again</p> ]一个对象prev () prev (expr) 参照next理解not(el) not(expr) 从jQuery对象中移出匹配的对象 el为dom元素 expr为jQuery表达式 <p>one</p><p id= a >o</p><a # onclick= js() >jQuery</a>jQuery代码及功能 function js() alert($( p ) not(document getElementById( a )l()); alert($( p ) not( #a l());$( p )由两个对象排除后的对象为[<p>one</p> ]siblings () siblings (expr) jquery匹配对象中其它兄弟级别的对象<p>one</p><div> <p id= a >o</p></div><a # onclick= js() >jQuery</a>jQuery代码及功能 function js() alert($( div ) siblings() eq(l());$( div ) siblings()的结果实返回两个对象[<p>one</p> <a # onclick= js() >jQuery</a> ]alert($( div ) siblings( a )返回一个对象[<a # onclick= js() >jQuery</a> ]其他addClass(class) 为匹配对象添加一个class样式removeClass (class) 将第一个匹配对象的某个class样式移出attr (name) 获取第一个匹配对象的属性<img src= test jpg /><a # onclick= js() >jQuery</a> jQuery代码及功能 function js() alert($( img ) attr( src ));返回test jpgattr (prop) 为第一个匹配对象的设置属性 prop为hash对象用于为某对象批量添加众多属性<img/><a # onclick= js() >jQuery</a>jQuery代码及功能 function js() $( img ) attr( src: test jpg alt: Test Image ); 运行结果相当于<img src= test jpg alt= Test Image />attr (key value) 为第一个匹配对象的设置属性 key为属性名 value为属性值<img/><a # onclick= js() >jQuery</a>jQuery代码及功能function js() $( img ) attr( src test jpg ); 运行结果相当于<img src= test jpg />removeAttr (name) 将第一个匹配对象的某个属性移出<img alt= test /><a # onclick= js() >jQuery</a>jQuery代码及功能 function js() $( img ) removeAttr( alt ); 运行结果相当于<img />toggleClass (class) 将当前对象添加一个样式不是当前对象则移出此样式返回的是处理后的对象<p>Hello</p><p class= selected >Hello Again</p><a # onclick= js() >jQuery</a>$( p )的结果是返回对象 [<p>Hello</p> <p class= selected >Hello Again</p> ]$( p ) toggleClass( selected )的结果是实返回对象 [ <p class= selected >Hello</p> <p>Hello Again</p> ] 三 CSS操作 传统javascript对css的操作相当繁琐比如<div id= a >css</div>取它的background语法是 document getElementById( a ) style background 而jQuery对css更方便的操作 $( #a ) background() $( #a ) background( red )$( #a )得到jQuery对象[ <div id= a … /div> ]$( #a ) background()将取出该对象的background样式 $( #a ) background( red )将该对象的background样式设为redjQuery提供了以下方法来操作cssbackground () background (val) color() color(val) css(name) css(prop) css(key value) float() float(val) height() height(val) width() width(val) left() left(val) overflow() overflow(val) position() position(val) top() top(val)这里需要讲解一下css(name) css(prop) css(key value) 其他的看名字都知道什么作用了！<div id= a >css</div><P id= b >test</P>css(name) 获取样式名为name的样式$( #a ) css( color ) 将得到样式中color值red ( #a ) css( background )将得到bluecss(prop) prop是一个hash对象用于设置大量的css样式$( #b ) css( color: red background: blue );最终效果是<p id= b >test</p> color: red background: blue hash对象 color为key red 为value css(key value) 用于设置一个单独得css样式$( #b ) css( color red );最终效果是<p id= b >test</p> 四 JavaScript处理$ browser() 判断浏览器类型返回boolen值$(function() if($ browser msie) alert( 这是一个IE浏览器 ); else if($ browser opera) alert( 这是一个opera浏览器 );)当页面载入式判断浏览器类型可判断的类型有msie mozilla opera safari$ each(obj fn) obj为对象或数组 fn为在obj上依次执行的函数注意区分$() each()$ each( [ ] function(i) alert( Item # + i + : + this ); ); 分别将为参数传入到function(i)中$ each( name: John lang: JS function(i) alert( Name: + i + Value: + this ); name: John lang: JS 为一个hash对象依次将hash中每组对象传入到函数中$ extend(obj prop) 用第二个对象扩展第一个对象var settings = validate: false limit: name: foo ;var options = validate: true name: bar ;$ extend(settings options);执行后settings对象为 validate: true limit: name: bar 可以用下面函数来测试$(function() var settings = validate: false limit: name: foo ; var options = validate: true name: bar ; $ extend(settings options); $ each(settings function(i) alert( i + = + this ); );)$ grep(array fn) 通过函数fn来过滤array 将array中的元素依次传给fn fn必须返回一个boolen 如fn返回true 将被过滤$(function() var arr= $ grep( [ ] function(i) return i > ; ); $ each(arr function(i) alert(i); );)我们可以看待执行$ grep后数组[ ]变成[ ]rge(first second) 两个参数都是数组排出第二个数组中与第一个相同的再将两个数组合并$(function() var arr = rge( [ ] [ ] ) $ each(arr function(i) alert(i); );)可以看出arr的结果为[ ]$ trim(str) 移出字符串两端的空格 $ trim( hello how are you? )的结果是 hello how are you? 五动态效果 在将这部分之前我们先看个例子相信做网页的朋友都遇到n级菜单的情景但点击某菜单按钮时如果它的子菜单是显示的则隐藏子菜单如果子菜单隐藏则显示出来传统的javascript做法是先用getElementById取出子菜单所在容器的id 在判断该容器的style display是否等于none 如果等于则设为block 如果不等于这设为none 如果在将效果设置复杂一点当点击按钮时不是忽然隐藏和显示子菜单而是高度平滑的转变这时就要通过setTimeout来设置子菜单的height了再复杂一点透明度也平滑的消失和显现这时显现下来需要编写很多代码如果js 基础不好的朋友可能只能从别人写好的代码拿过来修改了！jQuery实现上面效果只需要句话就行 $( #a ) toggle( slow ) 学完jQuery后还需要抄袭修改别人的代码吗？下面我们逐个介绍jQuery用于效果处理的方法 hide() 隐藏匹配对象<p id= a >Hello Again</p><a # onClick= ( #a ) hide() >jQuery</a>当点击连接时 id为a的对象的display变为none show() 显示匹配对象hide(speed) 以一定的速度隐藏匹配对象其大小（长宽）和透明度都逐渐变化到 speed有级( slow normal fast ) 也可以是自定义的速度 show(speed) 以一定的速度显示匹配对象其大小（长宽）和透明度都由逐渐变化到正常hide(speed callback) show(speed callback) 当显示和隐藏变化结束后执行函数callbacktoggle() toggle(speed) 如果当前匹配对象隐藏则显示他们如果当前是显示的就隐藏 toggle(speed) 其大小（长宽）和透明度都随之逐渐变化 <img src= jpg /><a # onClick= $( img ) toggle( slow ) >jQuery</a>fadeIn(speeds) fadeOut(speeds) 根据速度调整透明度来显示或隐藏匹配对象注意有别于hide(speed)和show(speed) fadeIn和fadeOut都只调整透明度不调整大小<img src= jpg /><a # onClick= $( img ) fadeIn( slow ) > jQuery </a>点击连接后可以看到图片逐渐显示 fadeIn(speed callback) fadeOut(speed callback) callback为函数先通过调整透明度来显示或隐藏匹配对象当调整结束后执行callback函数<img src= jpg /><a # onClick= $( img ) fadeIn( slow function() alert( Animation Done ); ) > jQuery </a>点击连接后可以看到图片逐渐显示显示完全后弹出对话框fadeTo(speed opacity callback) 将匹配对象以speed速度调整倒透明度opacity 然后执行函数callback Opacity为最终显示的透明度( ) <img src= jpg /><br><a # onClick= $( img ) fadeTo( slow function() alert( Animation Done ); ) > jQuery </a>大家可以看一下自己看看效果如果不用jQuery 编写原始javascript脚本可能很多代码！slideDown(speeds) 将匹配对象的高度由以指定速率平滑的变化到正常！<img src= jpg /><a # onClick= $( img ) slideDown( slow ) >jQuery</a>slideDown(speeds callback) 将匹配对象的高度由变化到正常！变化结束后执行函数callbackslideUp( slow ) slideUp(speed callback) 匹配对象的高度由正常变化到 slideToggle( slow ) 如果匹配对象的高度正常则逐渐变化到若为则逐渐变化到正常 六事件处理 hover(Function Function) 当鼠标move over时触发第一个function 当鼠标move out时触发第二个function样式 <style> redcolor:#FF </style>Html代码 <div id= a >sdf</div>jQuery代码及效果$(function() $( #a ) hover(function()$(this) addClass( red ); function() $(this) removeClass( red ); );)最终效果是当鼠标移到id为a的层上时图层增加一个red样式离开层时移出red样式toggle(Function Function) 当匹配元素第一次被点击时触发第一个函数当第二次被点击时触发第二个函数样式 <style> redcolor:#FF </style>Html代码 <div id= a >sdf</div>jQuery代码及效果$(function() $( #a ) toggle (function()$(this) addClass( red ); function() $(this) removeClass( red ); );)最终效果是当鼠标点击id为a的层上时图层增加一个red样式离开层时移出red样式bind(type fn) 用户将一个事件和触发事件的方式绑定到匹配对象上 trigger(type) 用户触发type形式的事件 $( p ) trigger( click )还有 unbind() unbind(type) unbind(type fn)Dynamic event(Function) 绑定和取消绑定提供函数的简捷方式例 $( #a ) bind( click function() $(this) addClass( red );)也可以这样写 $( #a ) click(function() $(this) addClass( red ););最终效果是当鼠标点击id为a的层上时图层增加一个red样式 jQuery提供的函数用于browers事件error(fn) load(fn) unload(fn) resize(fn) scroll(fn)用于form事件change(fn) select(fn) submit(fn)用于keyboard事件keydown(fn) keypress(fn) keyup(fn)用于mouse事件click(fn) dblclick(fn) mousedown(fn) mousemove(fn)mouseout(fn) mouseover(fn) mouseup(fn)用于UI事件blur(fn) focus(fn)以上事件的扩展再扩展为类举例 click(fn) 扩展 click() unclick() oneclick(fn) unclick(fn)click(fn) 增加一个点击时触发某函数的事件click() 可以在其他事件中执行匹配对象的click事件 unclick () 不执行匹配对象的click事件 oneclick(fn) 只增加可以执行一次的click事件 unclick (fn) 增加一个点击时不触发某函数的事件上面列举的用于browers form keyboard mouse UI的事件都可以按以上方法扩展 七 Ajax支持 通用方式 $ ajax(prop) 通过一个ajax请求回去远程数据 prop是一个hash表它可以传递的key/value有以下几种 (String)type 数据传递方式(get或post) ((String)url 数据请求页面的url ((String)data 传递数据的参数字符串只适合post方式 ((String)dataType 期待数据返回的数据格式(例如 xml script 或 json ) ((Boolean)ifModified 当最后一次请求的相应有变化是才成功返回默认值是false ((Number)timeout:设置时间延迟请求的时间可以参考$ ajaxTimeout ((Boolean)global 是否为当前请求触发ajax全局事件默认为true ((Function)error 当请求失败时触发的函数 ((Function)success 当请求成功时触发函数 ((Function)plete 当请求完成后出发函数jQuery代码及说明$ ajax(url: success:function(msg) $(div #a l(msg); );将返回的内容作为id为a的div内容$ ajax( url: ajax aspx type: get dataType: data: name=John&location=Boston success:function(msg) $( #a l(msg); );用get方式向ajax aspx页面传参数并将返回内容负给id为a的对象 $ ajaxTimeout(time) 设置请求结束时间 $ ajaxTimeout( )其它简化方式 $ get(url params callback) 用get方式向远程页面传递参数请求完成后处理函数除了url外其它参数任意选择！$ get( function(data) $( #a l(data) )$ get( ajax asp name: young age: function(data) alert( Data Loaded: + data); ) $ getIfModified(url params callback) 用get方式向远程页面传递参数从最后一次请求后如果数据有变化才作出响应执行函数callback$ getJSON(url params callback) 用get方式向远程json对象传递参数请求完成后处理函数callback $ getScript(url callback) 用get方式载入并运行一个远程javascript文件请求完成后处理函数callback $ post(url params callback) 用post方式向远程页面传递参数请求完成后处理函数callbackload(url params callback) 载入一个远程文件并载入页面DOM中并执行函数callback$( #a ) load( function() alert( load is done ); );仰天一笑徐羽向页面发出请求将返回结果装入id为a的内容中然后再执行函数callback loadIfModified(url params callback) 用get方式向远程页面传递参数从最后一次请求后如果数据有变化才作出响应将返回结果载入页面DOM中并执行函数callbackajaxStart(callback) 当ajax请求发生错误是时执行函数callbackajaxComplete(callback) 当ajax请求完成时执行函数callbackajaxError(callback) 当ajax请求发生错误时执行函数callbackajaxStop(callback) 当ajax请求停止时执行函数callbackajaxSuccess(callback) 当ajax请求成功时执行函数callback 八 jQuery插件 随着jQuery的广泛使用已经出现了大量jQuery插件如thickbox iFX jQuery googleMap等简单的引用这些源文件就可以方便的使用这些插件这里我简单的介绍一些网址供大家参考这些网站头提供了大量的demo 并且使用及其简单及时E文不好也能快速掌握！至此jQuery已经介绍完毕并合并整理提供给大家下载更多详细的使用请大家参考官方网站下面我再推荐一些jQuery的学习网站方便大家更好的掌握这项工具！ cha138/Article/program/Java/hx/201311/26563