网页资讯视频图片知道文库贴吧地图采购
进入贴吧全吧搜索
javascript吧 关注：269,219贴子：906,437
  • 16回复贴，共1页

继续求教！！！


a)请用符合Web语义的 (X)HTML 代码书写结构；
b)请用JavaScript将航班信息项按机票价格从低到高重新排列。


这是我的代码！


2025-07-24 06:18:43
广告
不感兴趣
开通SVIP免广告
<style type="text/css">
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acyonym,address,big,cite,code,del,dfn,em,img,ins,kdb,q,s,samp,small,strong,var,b,i,
dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,img{ margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent;}
ol,ul,li{ list-style:none outside;}
img{ border:none;font-size:0; }
input,select,img{ vertical-align:middle;}
a:link,a:visited{ text-decoration:none;}
a:hover{ text-decoration:underline;} .box{ width:489px; height:223px; background:url(images/img.png) no-repeat; margin:5px auto;}
span{ color:#FC6A00;}
.a{ width:489px; height:35px; background-color:#09C; color:#FFF; font-size:14px;}
.a ul li{ float:left;display:block; width:97.8px; text-align:center; position:relative;top:10px;}
.b{ width:489px; height:55px; color:#999; font-size:13px;}
.b ul li{ float:left;display:block; width:97.8px; position:relative;top:15px; padding-left:2px;}
.c{ width:489px; height:55px; color:#999; font-size:13px;}
.c ul li{ float:left;display:block; width:97.8px; position:relative;top:15px; padding-left:2px;}
.d{ width:489px; height:55px; color:#999; font-size:13px;}
.d ul li{ float:left;display:block; width:97.8px; position:relative;top:15px; padding-left:2px;}
</style>
</head> <body>
<div class="box">
<div class="a">
<ul>
<li>航班信息</li>
<li>起抵时间/机场</li>
<li>机建/燃油</li>
<li>价格</li>
<li>操作</li>
</ul>
</div>
<div class="b">
<ul>
<li style=" width:30px;"><img src="images/img1.png"/></li>
<li style=" float:left; width:53px;">KN2288联合航空</li>
<li style=" width:140px;">11：00萧山国际机场 12:50南苑机场</li>
<li style=" width:90px;">50/40</li>
<li id="P_1" class="aaa" style=" width:92px;">￥<span>849</span></li>
<li style=" width:70px;"><img src="images/img3.png"/></li>
</ul>
</div>
<div class="c">
<ul>
<li style=" width:30px;"><img src="images/img2.png"/></li>
<li style=" float:left; width:53px;">KN2288联合航空</li>
<li style=" width:140px;">11：00萧山国际机场 12:50南苑机场</li>
<li id="P_2" style=" width:90px;">50/40</li>
<li style=" width:90px;">￥<span>1044</span></li>
<li style=" width:70px;"><img src="images/img3.png"/></li>
</ul>
</div>
<div class="d">
<ul>
<li style=" width:30px;"><img src="images/img2.png"/></li>
<li style=" float:left; width:53px;">KN2288联合航空</li>
<li style=" width:140px;">11：00萧山国际机场 12:50南苑机场</li>
<li style=" width:90px;">50/40</li>
<li id="P_3" style=" width:90px;">￥<span>1020</span></li>
<li style=" width:70px;"><img src="images/img3.png"/></li>
</ul>
</div>
</div>
</body>
</html>


主要问B的 那个排序!!!!


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><style type="text/css">html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acyonym,address,big,cite,code,del,dfn,em,img,ins,kdb,q,s,samp,small,strong,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,img{ margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent;}ol,ul,li{ list-style:none outside;}img{ border:none;font-size:0; }input,select,img{ vertical-align:middle;}a:link,a:visited{ text-decoration:none;}a:hover{ text-decoration:underline;} #box{ width:489px; height:223px; background:url(images/img.png) no-repeat; margin:5px auto;}span{ color:#FC6A00;}.a{ width:489px; height:35px; background-color:#09C; color:#FFF; font-size:14px;}.a ul li{ float:left;display:block; width:97.8px; text-align:center; position:relative;top:10px;}.b{ width:489px; height:55px; color:#999; font-size:13px;}.b ul li{ float:left;display:block; width:97.8px; position:relative;top:15px; padding-left:2px;}.c{ width:489px; height:55px; color:#999; font-size:13px;}.c ul li{ float:left;display:block; width:97.8px; position:relative;top:15px; padding-left:2px;}.d{ width:489px; height:55px; color:#999; font-size:13px;}.d ul li{ float:left;display:block; width:97.8px; position:relative;top:15px; padding-left:2px;}</style><script type="text/javascript">window.onload=function(){ var aSpan=document.getElementsByTagName('span'); var aDiv=document.getElementById('box').getElementsByTagName('div'); var aS=new Array; var arr=[]; for(var i=0;i<aDiv.length;i++ ) { arr.push(aDiv[i].innerHTML); } for(var i=0;i<aSpan.length;i++) { aS.push(aSpan[i].innerHTML); aS[i]=new String(aS[i]); aS[i].index=i; } document.onclick=function() { aS.sort(function(value1,value2) { return value1-value2; }); for(var i=0;i<aS.length;i++) { aDiv[i+1].innerHTML=arr[aS[i].index+1]; }
}}</script></head> <body><div id="box"><div class="a"><ul><li>航班信息</li><li>起抵时间/机场</li><li>机建/燃油</li><li>价格</li><li>操作</li></ul></div><div class="b"><ul><li style=" width:30px;"><img src="images/img1.png"/></li><li style=" float:left; width:53px;">KN2288联合航空</li><li style=" width:140px;">11：00萧山国际机场 12:50南苑机场</li><li style=" width:90px;">50/40</li><li id="P_1" class="aaa" style=" width:92px;">￥<span>849</span></li><li style=" width:70px;"><img src="images/img3.png"/></li></ul></div><div class="c"><ul><li style=" width:30px;"><img src="images/img2.png"/></li><li style=" float:left; width:53px;">KN2288联合航空</li><li style=" width:140px;">11：00萧山国际机场 12:50南苑机场</li><li id="P_2" style=" width:90px;">50/40</li><li style=" width:90px;">￥<span>1044</span></li><li style=" width:70px;"><img src="images/img3.png"/></li></ul></div><div class="d"><ul><li style=" width:30px;"><img src="images/img2.png"/></li><li style=" float:left; width:53px;">KN2288联合航空</li><li style=" width:140px;">11：00萧山国际机场 12:50南苑机场</li><li style=" width:90px;">50/40</li><li id="P_3" style=" width:90px;">￥<span>1020</span></li><li style=" width:70px;"><img src="images/img3.png"/></li></ul>
</div></div></body></html>






扫二维码下载贴吧客户端

下载贴吧APP
看高清直播、视频！
  • 16回复贴，共1页
分享到: