从页面代码看火车票订票系统 12306的代码质量

其他 2018-10-15 12:20:17 阅读次数: 0 
<!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" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta name="Robots"   content="none"/>
<meta http-equiv="Expires" content="0"/>
<meta http-equiv="Cache-Control"  content="no-cache"/> 
<meta http-equiv="pragma"  content="no-cache"/> 
<title>铁路客户服务中心</title>

<link  href="/otsweb/css/style.css" rel="stylesheet"  type="text/css"/>
<link  href="/otsweb/css/contact.css" rel="stylesheet"  type="text/css"/>
<link href="/otsweb/css/validation.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/otsweb/css/easyui.css"/>
<link rel="stylesheet" type="text/css" href="/otsweb/css/suggest.css"/>
<link href="/otsweb/css/cupertino/jquery-ui-1.8.2.custom.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="http://www.12306.cn/mormhweb/images/favicon.ico"/>
<script type="text/javascript" src="/otsweb/js/common/iepngfix_tilebg.js?version=2.0"></script>
<script src="/otsweb/js/common/jquery-1.4.2.min.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/autoHeight.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/jquery.bgiframe.min.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/jquery.easyui.min.js?version=2.0" type="text/javascript"></script>

<script src="/otsweb/js/common/datepicker/WdatePicker.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/j.suggest.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/trainCodeSuggest.js?version=2.0" type="text/javascript"></script>
<style>
       div,img,li,input,a { behavior: url("/otsweb/js/common/iepngfix.htc") }
</style>


</head>
<body>



<script src="/otsweb/js/common/jquery-ui-1.8.2.custom.dialog.min.js?version=2.0"
	type="text/javascript"></script>	

<script src="/otsweb/js/common/pop_message.js?version=2.0"
	type="text/javascript"></script>
<div class="conWrap" >
<div id="menu_w" class="menu_w" >
      <div id="menu_left" class="menu_left">
        <ul>
          <li><a href="/otsweb/order/querySingleAction.do?method=init" class="n_on" target="main"><cite>车票预订</cite></a></li>
<li><a href="http://dynamic.12306.cn/TrainQuery/leftTicketByStation.jsp" class="n_out" target="main"><cite>余票查询</cite></a></li>

<li name="horverLi"><a href="#" class="n_out"><cite>列车时刻表查询</cite></a> 
<p style="width:135px">

   <a href="http://dynamic.12306.cn/TrainQuery/trainPassStationByTrainCode.jsp" target="main">车次查询</a>
   <a href="http://dynamic.12306.cn/TrainQuery/trainInfoByStation.jsp" target="main">发到站查询</a>
   <a href="http://dynamic.12306.cn/TrainQuery/ticketPriceByStation.jsp" target="main">票价查询</a>
   <a href="http://dynamic.12306.cn/TrainQuery/middleStation.jsp" target="main">中转查询</a>
   <a href="http://dynamic.12306.cn/TrainQuery/passTrainInfoByStation.jsp" target="main">车站经过车次查询</a>
</p>
</li>

<li><a href="http://dynamic.12306.cn/map_zwdcx/CCCX.jsp" class="n_out"  target="main"><cite>正晚点查询</cite></a></li>
<li><a href="http://dynamic.12306.cn/TrainQuery/sellTicketStation.jsp" class="n_out"  target="main"><cite>客票代售点</cite></a></li>
<li><a href="http://dynamic.12306.cn/TrainQuery/TrainInfoByCity.jsp" class="n_out"  target="main"><cite>铁路旅程规划</cite></a></li>
</ul>
</div>

<div class="menu_r">
    <ul>
      <li class="menu_sline"><a href="/otsweb/loginAction.do?method=initForMy12306"  class="n_out" target="main"><cite>我的12306</cite></a></li>
      <li id="login_out"><a href="/otsweb/login.jsp" class="n_out" target="main"><cite>登录</cite></a></li>

      <li id="username_"><a href="/otsweb/registAction.do?method=regitNote" class="n_out"  target="main"><cite>注册</cite></a></li>
      
    </ul>
  </div>
</div>
    <script>
    $(function(){
    	//if(!$.browser.msie){
    	//	alert("非常抱歉，系统目前暂不支持您的浏览器！");
    	//}
     $('.menu_left ul li[name="horverLi"]').hover(
		function(){
		   $(this).find('p').stop(true,true).show();
		},function(){
     $(this).find('p').stop(true,true).hide();
		  });
	});
        
         $("#menu_w a").bind("click",function(){
        	 $("#menu_w a").attr("class","n_out");
             $(this).attr("class","n_on");
          });
         function hideMenu(){
             $("#menu_w").hide();
             doIframe() ;
         }
         function showMenu(){
             $("#menu_w").show();
             doIframe() ;
         }
         function clickMenu(title){
             $("#menu_w a").each(function(){
                if($(this).find("cite").length>0){
                 if($(this).find("cite")[0].innerHTML == title){
                	 $(this).click();
                  }
                }
             });
         }

         function hasLogin(_name)
         {
             $("#username_ a").attr("href","/otsweb/sysuser/user_info.jsp");
             $("#username_ a > cite").html(_name);
        	 $("#login_out a").attr("href","/otsweb/loginAction.do?method=logout");
        	 $("#login_out a > cite").html("退出");
         }

       //退出登录
         function notLogin(){
        	 $("#username_ a").attr("href","/otsweb/registAction.do?method=regitNote");
        	 $("#username_ a > cite").html("注册");
         	 $("#login_out a").attr("href","/otsweb/loginAction.do?method=init");
        	 $("#login_out a > cite").html("登录");
         }
         
          $(document).ready(function(){
             var iframeForwardUrl = "";
   			if (iframeForwardUrl != ""){
   				$("#main")[0].src=iframeForwardUrl;
   				if(iframeForwardUrl == "http://dynamic.12306.cn/TrainQuery/leftTicketByStation.jsp"){
   					clickMenu('余票查询');
   	   			}else if(iframeForwardUrl == "http://dynamic.12306.cn/TrainQuery/trainPassStationByTrainCode.jsp"){
   	   				clickMenu('列车时刻表查询');
   	   	   		}else if(iframeForwardUrl == "http://dynamic.12306.cn/TrainQuery/ticketPriceByStation.jsp"){
   	   				clickMenu('列车时刻表查询');
   	   	   		}else if(iframeForwardUrl == "http://dynamic.12306.cn/TrainQuery/sellTicketStation.jsp"){
   	   	   			clickMenu('客票代售点');
   	   	   		}else if(iframeForwardUrl == "http://dynamic.12306.cn/map_zwdcx/CCCX.jsp"){
   	   	   			clickMenu('正晚点查询');
   	   	   		}
   	   	   		
   			}else{
   			    $("#main")[0].src="/otsweb/loginAction.do?method=init";
   			}
          });
    </script>
    <div class="enter_w" style="width:960px">
       <iframe id="main"
			name="main" frameborder="0" class="autoHeight"
			 width="100%"
			scrolling="auto"></iframe>
			
			<iframe id="ictiframe" src="" style="height:0px;width:0px;diapay:none"/>
			
    </div>
    </div>
</body>
</html>

<script language="javascript">
		var message = "";
        var messageShow ="";
        var flag ='null';
        if(messageShow != ""){
			if(flag == 'u'){
				$("#messageUp").css({display:"inline"});
				document.getElementById("messageUp").innerHTML = message;
			}else{
				$("#messageDown").css({display:"inline"});
				document.getElementById("messageDown").innerHTML = message;
			}
         }else{
     		if ( message != ""){ 
    			alert(message);

    		}

         } 
</script>


请原谅我一开始就贴这么一大段代码。

我看不到后台代码，也无法分析其架构。但是我有代码洁癖，就看这点代码，恶心的够呛。

1 规范性

<link  href="/otsweb/css/style.css" rel="stylesheet"  type="text/css"/>
<link  href="/otsweb/css/contact.css" rel="stylesheet"  type="text/css"/>
<link href="/otsweb/css/validation.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/otsweb/css/easyui.css"/>
<link rel="stylesheet" type="text/css" href="/otsweb/css/suggest.css"/>
同样引用 css，为啥写法不一样啊？ 

<script type="text/javascript" src="/otsweb/js/common/iepngfix_tilebg.js?version=2.0"></script>
<script src="/otsweb/js/common/jquery-1.4.2.min.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/autoHeight.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/jquery.bgiframe.min.js?version=2.0" type="text/javascript"></script>
<script src="/otsweb/js/common/jquery.easyui.min.js?version=2.0" type="text/javascript"></script>
这段要引用这么多 js 脚本，书写也是混乱的， 
iepngfix_tilebg
这个是为了 6.0 不支持PNG的js吧。jquery 自己就可以搞定啊，还要添足干啥？ 

<script src="/otsweb/js/common/jquery-ui-1.8.2.custom.dialog.min.js?version=2.0"
	type="text/javascript"></script>	

<script src="/otsweb/js/common/pop_message.js?version=2.0"
	type="text/javascript"></script>
要是我看到程序员把这样的引用放在body里面，我一定骂个狗头喷血。 

    	//if(!$.browser.msie){
    	//	alert("非常抱歉，系统目前暂不支持您的浏览器！");
    	//}
没用的代码，干嘛不删除？ 

if(flag == 'u'){
				$("#messageUp").css({display:"inline"});
				document.getElementById("messageUp").innerHTML = message;
			}else{
				$("#messageDown").css({display:"inline"});
				document.getElementById("messageDown").innerHTML = message;
			}
这段特别搞笑， 写代码的人难道不知道  jQuery的 “$”是干啥用的么？ 还混着用了。

二 CSS 优化

看看 这个页面引用了多少CSS，都有用么？CSS 压缩了吗，规范化了吗。

三  iframe 嵌套

订票的首页 居然嵌套了三层iframe。什么目的，我没懂

四  一个登录页面居然发生了三十次请求，我们也看得出订票系统硬件系统相当强大。



五 简单的破坏一下

在密码的地方输入   and 1=1 , 或者 输入一个  select * from 一类的 看看会出现什么奇迹？

这个留给大家做实验吧。

时间仓促，有空再深入研究其代码质量吧。

猜你喜欢

转载自blog.csdn.net/diannet/article/details/7181298
今日推荐
开源日报 | Chrome内置Gemini的意义不在于Gemini；中国AI追随之路的五大误区；ECharts创始人“下海”养鱼；谷歌I/O开发者大会什么都有，只是没有惊喜
微软回应中国区AI团队“打包赴美”传闻
基于大语言模型的开源知识库问答系统 MaxKB GitHub Star 数量突破 5,000 个！
美国拟限制 AI 大模型出口中国和俄罗斯
苹果将与 OpenAI 达成协议，将 ChatGPT 应用于 iPhone
openKylin 社区生态委员会第六次会议圆满召开
阿里云正式发布通义千问 2.5
Python 3.13 发布首个 Beta：实验性自由线程模式和 JIT、改进交互式解释器
Stack Overflow 拿我的代码去训练 AI 大模型，还封了我的账号
Pop!_OS 的 COSMIC 桌面完成 App Store 上架工作
《2024 年一季度互联网投融资运行情况》研究报告
报告：Django 仍然是 74% 开发者的首选
周排行
laravle中orm简单的增删改查
文本分类 特征选取之CHI开方检验
Spark核心编程-WordCount
大数据开发实战系列之电信客服(1)
读书笔记 - 把时间当作朋友 by 李笑来
python 笔记--if else
SpringBoot/Mybatis/Druid, 多数据源MultiDataSource配置思路
排序三个整数
redis集群搭建【2】-Windows中Redis集群搭建
STM32F030驱动TM1650点亮4联数码管
每日归档
更多
2024-05-16(6)
2024-05-15(24)
2024-05-14(0)
2024-05-13(18)
2024-05-12(0)
2024-05-11(38)
2024-05-10(38)
2024-05-09(35)
2024-05-08(42)
2024-05-07(14)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022