课件课后练习代码-经典案例

JavaAJAX&JQUERYDOM操作演jQuery处理事jQuery动jQuery类似数组的操jQuery对AJAX的支新建工程a.dom查<!--查询<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<scripttype="text/javascript">functionf1(){<bodystyle="font-<divousername:<input<select<inputtype="button"value="Click"dom创建和添加<!--dom创建和添加操作<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<scripttype="text/javascript">functionf1(){//var$obj=oo<bodystyle="font-<ul<inputtype="button"value="Click"e.before()在每个匹配的元前插入内dom删除节<!--dom删除<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<scripttype="text/javascript">functionf1(){//$('#u1//$('#u1$('#u1<bodystyle="font-<ul<li<inputtype="button"value="Click"dom节<!----<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<script$('#u1 var$obj=$('#u1 <bodystyle="font-<ul<inputid="b1"type="button"value="Click"/>属性操<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<script<bodystyle="font-<divo<inputtype="button"value="Click"样式操<!--dom样式操作<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle font- <scripttype="text/javascript"src="../js/jquery-<script<bodystyle="font-<divid="d1"o<inputtype="button"value="Click"b.removeClass遍历节<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<script//var$arr=<bodystyle="font-<div<span>o<inputtype="button"（案例结束<!--事件绑订--><metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<script <bodystyle="font-<div o<inputid="b1"type="button"value="Click"合成事hover(enter,leave):模拟光标悬停事件<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitlebackground- background- <scripttype="text/javascript"src="../js/jquery-<script//当光标进入时执行this代表当前绑订事件的那个dom $(this).after("<div <bodystyle="font-<divid="d1"><ahref="javascript:;"id="a1">如何才能学好c.hover(enter,leave事件冒<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitleborder:1pxsolid <scripttype="text/javascript"src="../js/jquery-<script varobj=<bodystyle="font-<div<ahref="javascript:;"<ahref="javascript:;"<ahref="javascript:;"事件冒常用方法&&回调函<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitlebackground- background- background- <scripttype="text/javascript"src="../js/jquery-<scriptalert('<bodystyle="font-<ahref="javascript:;"id="a1">如何才能学好<divid="d1"> <div<div快速显示&&改变元素的高fadeIn()&&fadeOut()改变点击红域将显回调函自定义动<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<script<bodystyle="font-<div<inputvalue="点我，上面的div就会走"红域会移动（案例结束3.33.4<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitle<scripttype="text/javascript"src="../js/jquery-<scriptvar$obj=$('#u1if(index==}//var$o1=//varindex=varobj=<bodystyle="font-<ul<inputtype="button"value="Click"get()返回dom（案例结束<metahttp-equiv="Content-Type"content="text/html;charset=UTF-<title>Inserttitlelist-style- ulbackground-margin-border:1pxsolidtext- background- <scripttype="text/javascript"src="../js/jquery-<script$('ul <bodystyle="font-<li>选项一<li>选项二<li>选项三（案例结束服务器返回JSON字符新建<%@pagecontentType="text/html;charset=utf-<title>Inserttitle background- <scripttype="text/javascript"src="js/jquery-<script//ajax alert(' <bodystyle="font-<selectstyle="width:120px;"id="s1"<optionvalue="bmw520">宝马<option<optionvalue="maiten">新建packagepublicclassCarprivateStringname;privatedoubleprice;privateStringdesc;publicCar(Stringname,doublesuper();=name;this.price=price;this.desc=desc;price,Stringdesc)}publicCar(){super();}publicStringgetDesc(){returnpublicvoidsetDesc(Stringdesc){this.desc=desc;}publicStringgetName(){returnname;}publicvoidsetName(Stringname){=name;}publicdoublegetPrice(){returnprice;}publicvoidsetPrice(doubleprice){this.price=packageimportimportimportimportimport importimportimportpublicclassActionServletextends{publicvoidservice(HttpServletRequestrequest,HttpServletResponsethrowsServletException,IOExceptionStringuriStringpath=PrintWriterout=StringnameCarcar=newCar("bmw520",50,"JSONObjectobj=}elseCarcar=newCar("qqme",5,"JSONObjectobj=Carcar=newCar("maiten",18,JSONObjectobj=}}}}测试b.返回json修改<%@pagecontentType="text/html;charset=utf-<title>Inserttitlebackground- <scripttype="text/javascript"src="js/jquery-<script//ajax //1.在id为s1的<select>$('#s1').after("<div//2.该<div>+data.price+'<br/>'+'描述:'+//3.设置该<div},1000);alert('}<bodystyle="font-<selectstyle="width:120px;"id="s1"<optionvalue="bmw520">宝马<option<optionvalue="maiten">服务器返回XML文新建<%@pagecontentType="text/html;charset=utf-<title>Inserttitlebackground-<scripttype="text/javascript"src="js/jquery-<script var$obj=$('#s1').after("<div++'<br/>描述:'+//e1,e2alert('}<bodystyle="font-<selectstyle="width:120px;"<optionvalue="bmw520">宝马<option<optionvalue="maiten">修改packageimportimportimportimportimportimportimportimportpublicclassActionServletextends{publicvoidservice(HttpServletRequestrequest,HttpServletResponsethrowsServletException,IOExceptionStringuriStringpath=PrintWriterout=StringBuffersb=newStringname}else a.返回一颗xmlb.发送get请求（post请求格式一样新建<%@pagecontentType="text/html;charset=utf-<title>Inserttitlebackground- <scripttype="text/javascript"src="js/jquery-<script$('#s1').after("<div +data.price+'<br/>'+'描述:'+ },1000); <bodystyle="font-<selectstyle="width:120px;"<optionvalue="bmw520">宝马<option<optionvalue="maiten">修改 packageimportimportimportimportimportimportimportimportpublicclassActionServletextends{publicvoidservice(HttpServletRequestrequest,HttpServletResponsethrowsServletException,IOExceptionStringuriStringpath=PrintWriterout=StringnameCarcar=newCar("bmw520",50,"JSONObjectobj=}elseCarcar=newCar("qqme",5,"JSONObjectobj=Carcar=newCar("maiten",18,JSONObjectobj=}}}}load方新建<%@pagecontentType="text/html;charset=utf-<title>Inserttitle<scripttype="text/javascript"src="js/jquery-<scriptvarairline=<bodystyle="font-<tableborder="1"cellpadding="0"cellspacing="0"<tr><td>1</td><td><a修改packageimportimportimportimportimportimportimportimportpublicclassActionServletextendsHttpSer