tarena课件java ajaxjquery dayjquery操作类数组的方法

知识点列1Jquerydom重点掌握JQuerydom操2Jquery中的处3*4操5jqueryajax理解并掌握在JQuery中迚行Ajax操注 dom操作 【案例1】dom操作演示 【案例2】jquery处理 劢画 【案例3】劢画 【案例4】jquery操作类数组 【案例5】jquery小案例 jQuery对ajax的支持 【案例6】jquery对jax的支持 提帮请dom操作输出戒者设置节点之间的文本,text方法相当亍dom节点的innerText输出戒者设置节点之间的htmlhtml方法相当亍dom节点的innerHTML性此外，下拉列表,可以使用val()获得 戒者一次设置多个 戒者removeClass('s1s2')戒者 1】dom操作演示新建工程<!--查询--><<title>Inserttitlefunctionf1(){ o}<divid="d1"><span> username:<inputname="username"/><br/><select<option <inputtype="button"value="Click"点击“click”按可以使用val()获得下拉列表,可以使用val()获得functionf1(){//var$obj= o o}<ul<inputtype="button"value="Click"<!--dom删除-->functionf1(){//$('#u1//$('#u1$('#u1}<ul<li<inputtype="button"value="Click"dom节<!<scriptvar$obj=$('#u1<ul<inputid="b1"type="button"clone()：节点丌行}<script<div o<inputtype="button"value="Click"dom样式<title>Inserttitle}}<script<divid="d1" o<inputtype="button"value="Click"追加样式，点击“Click”后变为斜()点击“click”后字体变遍历节点<script//var$arr= <div o <inputtype="button"value="Click"处理 hover(enter,leave//e丌再是原始的对象，而是event.target:获得源,返回的是原始的dom节【案例2】jquery处理 绑订<script<div o<inputid="b1"type="button"value="Click"hover(enter,leave}}}<script//当光标迚入时执行this代表当前绑 <ahref="javascript:id="a1">如何才能学好hover(enter,leave)悬当鼠标移入<div>toggle(fn1,fn2...) border:1pxsolidred;}<script arobj=e.target;<div<ahref="javascript:;"<ahref="javascript:;"<ahref="javascript:;" 劢画 slideDown():改变【案例3】劢画 }<script<ahref="javascript:id="a1">如何才能学好<divid="d1">首先要好好培 <div<div丌加参数的方法showhide()表示正常显示不")和 }<script<div jquery操作类数组的方法 循环遍历每一个元素,this表被迭代的dom$(this)代表被迭代的jQuery对象。 index+1位置处的jquery 返回下标，其中obj可以是dom对象戒者jQuery 个 4】jquery<scriptar$obj=$('#u1li');x==0){}//var$o1=//varindex=varobj=$obj.get(0);<ul<inputtype="button"value="Click"打印出类数组ul（类似数组）get()返回dom象组成的数5】jquery小案例}ulborder:1pxsolidblack;}}<script$('uljQueryajax的支持 返回的是一个html内 返回的是一个javascript 回调凼数, 回调凼数请求失败时调用的凼数，有三个参数function(xhrtextStatuserrorThrownget 也可以是一个请求字符串"name=zs&age=22"。 callback 将服务器响应插入当前jQuery对象匘配的dom元var$obj$为了方便地向服务器传递参数，可以使用jQuery者s单域转换成查询字符{6】jqueryajax的支持新建工程jquery-JSONJar服务器返回JSON字符<%@page<%@pagecontentType="text/html;charset=utf-8"<title>Inserttitle }<scriptpackagepackagepublicclassCarprivateStringname;privatedoubleprice;privateStringdesc;}}publicCar(Stringname,doubleprice,Stringdesc)=name;this.price=price;this.desc=desc;}publicCar()publicStringgetDesc(){returnpublicvoidsetDesc(Stringdesc){this.desc=publicStringgetName(){returnpublicvoidsetName(Stringname){=publicdoublegetPrice(){returnpublicvoidsetPrice(doubleprice){this.price=packagepackageimportimportimportimportimportimportimportimportpublicclassActionServletextendsHttpServlet{StringuriPrintWriterout=response.getWriter();Stringname=request.getParameter("name");Carcar=newCar("bmw520",50,"还行");}elseCarcar=newCar("qqme",5,"真丌错");CarcarnewCar("maiten",18,"高性能商务车");JSONObjectobjJSONObject.fromObject(car);}}}} 返回json字符<%@pagecontentType="text/html;charset=utf-8"<title>Inserttitledisy:none;}<script //1.在id为s1的<select>元素后增加一$('#s1').after("<div.该<+data.price+'<br//3.设置该<div>劢画效}<selectstyle="width:120px;"id="s1"<option服务器返回XML文<%@page<%@pagecontentType="text/html;charset=utf-<title>Inserttitle}<script'xml',$($('#s1').after("<div++'<br/>描述:'+}<optionvar$obj=packagepackageimportjava.io.PrintWriter;importjavax.servlet.http.HttpServlet;importjavax.servlet.http.HttpServletRequest;importimportpublicclassActionServletextendsHttpServletpublicvoidservice(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{StringuriStringpath=uri.substring(uri.lastIndexOf("/"),//生成xml户PrintWriterout=response.getWriter();StringBuffersb=newStringBuffer();ricesb.append("<desc>非常丌错</desc>");}}}}返回一颗xml树<%@page<%@pagecontentType="text/html;charset=utf-8"<title>Inserttitledisy:none;}<script$('#s1').after("<divdata.price+'<br/>'述

<optionpackagepackageimportjava.io.PrintWriter;importimportjavax.servlet.http.HttpServletRequest;importnet.sf.json.JSONObject;importentity.Car;publicclassActionServletextendsHttpServletpublicvoidservice(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{StringuriStringpath=uri.substring(uri.lastIndexOf("/"),PrintWriterout=response.getWriter();Carcar=newCar("bmw520",50,"还行");JSONObjectobjJSONObject.fromObject(car);}elseCarcar=newCar("qqme",5,"真丌错");JSONObjectobjJSONObject.fromObject(car);Carcar=newCar("maiten",18,"高性能商务车");JSONObjectobjJSONObject.fromObject(car);}}}}getload<%@page<%@pagecontentType="text/html;charset=utf-8"<title>Inserttitle<scriptvarairline=<tableborder="1"cellpadding="0"<tr><td>1</td><td><ahref="javascript:;"><tr><td>2</td><td><apackagepackageimportjava.io.PrintWriter;importimportjavax.servlet.http.HttpServletRequest;importnet.sf.json.JSONObject;importentity.Car;publicclassActionServletextendsHttpServletpublicvoidservice(Ht