XML与电子商务应用上机实验指导书.doc

XML与电子商务应用上机实验指导书

———————————————————————————————— 作者：
———————————————————————————————— 日期：

2

个人收集整理 勿做商业用途
上机实验指导书

课程名称: XML与电子商务应用
总学时:48
实验学时:16
指导教师：刘平峰
实验名称：
（一） HTML标记语言与网页设计(4学时）
（二） XML标记语言与内容组织(6学时）
（三） XML文档的格式化显示与转换(6学时)
实验一：HTML标记语言与网页设计

1．实验目的：
熟悉常用的HTML标记，能读懂较为复杂的HTML源代码并能使用HTML标记设计网页。
2．实验内容:
分为两个部分,第一部分是验证型实验内容，第二部分是设计型实验内容。
(1)验证型实验内容
参考课件示例，在记事本中编写如下代码并查看显示效果:
①使用下面标记编写HTML源代码：〈html〉、〈head〉、〈title〉、〈body>、、〈hr>、〈a〉、。
②使用下面列标记绘制表格：ML代码显示效果截图
3．预习要求及参考书目：
要求预习课件第二章的内容,编写HTML文档实例参考课件“Html标记示例”目录下的所有示例文件。
4．实验步骤：
(1） 在Windows环境中，打开记事本和浏览器准备好工作环境。
(2） 在记事本中输入实验内容并进行适当的扩展,完成后将文件保存为＊。html文件。
(3） 在浏览器中打开刚才所保存的＊。html文件并查看显示效果。如不能正常显示，进行查错调试；如能正常显示总结上述标记的作用.
5．实验报告要求
要求在实验课程开始前撰写预习内容，实验课程结束当天撰写实验过程中设计的网页代码、以及关于实验过程中错误查排和体会的实验小结。

实验二：XML标记语言与内容组织

1．实验目的：
熟悉XML的声明、元素、处理指示和字符数据，能读懂较为复杂的XML源代码并能使用通过自定义XML标记描述结构化的、层次化的数据;理解DTD以及Schema所起的作用，并能熟练掌握在DTD与Schema中定义元素和子元素和属性的方法和格式,理解它们之间的异同，并对Schema在数据表示上的优势有一个明确的认识;掌握名字空间的用法,XML文档和DTD、Schema文档之间的关联方法.本实验着重点放在语法训练和综合运用上。利用DTD和Schema定义元素、子元素和属性，编写XML文档并验证其有效性。
2．实验内容：
分为两个部分，第一部分是验证型实验内容，第二部分是设计型实验内容。
（1）验证型实验内容
重复教材上关于图书的DTD文档、Schema文档和XML文档的内容。即针对图书的相关信息，包括书名、图书所属分类、作者、出版商、出版日期、印刷次数（具体内容可自己确定）,分别写出相应的DTD（要求DTD文档分为内部DTD和外部DTD两种方式分别编写)与Schema文档，然后用xml描述自己拥有的图书的信息，并将xml文档分别与DTD文档和Schema文档关联，打开xml文档并观看是否能够通过有效性检查和显示结果。
(2)设计型实验内容
图2是一公司出库单的内容，针对出库单用Schema定义描述出库单信息的业务规范，然后遵从该规范写出图中所示信息的xml文档，与Schema文档关联，打开xml文档并观看是否能够通过有效性检查和显示结果（参考答案见附件二)。
图2 某公司出库单信息
3．预习要求及参考书目：
要求预习课件第3章、第4章和第5章的内容，并在W3C网站（http://www。w3.org/standards/xml/）和IBM网站（http：//
4．实验步骤：
（1）在Windows环境中，打开xml编辑工具xmlSpy和浏览器准备好工作环境。
（2）采用内部DTD的方式描述图书信息。打开xmlSpy编辑工具新建xml文档,命名为book。xml，在第一行xml声明之后用DTD定义图书描述的规则，接着描述自己手中具体的图书信息，保存文档，根据xmlSpy的提示排除错误，最后在浏览器中打开book.xml查看显示结果。
（3）采用外部DTD方式描述图书信息.用xmlSpy编写图书的DTD文档并保存为book.dtd，再用xmlSpy根据DTD中关于图书描述的规范编写描述自己手中图书信息的xml文档，以外部DTD的方式引用事先编辑好的book。dtd文档，并将xml文档保存为book2.xml，根据xmlSpy的提示排除错误,最后在浏览器中打开book2.xml查看显示结果。
（4)采用Schema定义图书信息描述规范。用xmlSpy编写图书描述规范的schema文档并保存为book.xsd，再用xmlSpy根据book。xsd中关于图书描述的规范编写描述自己手中图书信息的xml文档，并与book.xsd相关联，将xml文档保存为book3.xml，根据xmlSpy的提示排除错误，最后在浏览器中打开book3。xml查看显示结果.
(5）采用Schema定义图2中出库单的描述规范.用xmlSpy编写出库单描述规范的schema文档并保存为checkout。xsd，再用xmlSpy根据checkout。xsd中关于出库单描述的规范编写描述图2中出库单实例信息的xml文档,并与checkout.xsd相关联，将xml文档保存为checkout。xml根据xmlSpy的提示排除错误，最后在浏览器中打开checkout。xml查看显示结果.
5．实验报告要求
要求在实验课程开始前撰写预习内容,实验课程结束当天撰写实验过程中设计的DTD文档、Schema文档和XML文档、以及关于错误总结和体会的实验小结。
实验三: XML文档的格式化显示与转换
1．实验目的:
掌握如何通过CSS对xml文档中的数据进行显示的方法，理解CSS的基本语法规则。掌握如何通过XSL对xml文档中的数据进行显示和转换的方法,理解XSL中xPath概念,掌握XPath语法规则,通过该实验增进对xml中内容与显示分离的特点的了解.并对前面所学html的知识起到一个复习的作用。
2．实验内容：
实验内容分为两个部分，即CSS实验和XSL实验.
（1）CSS实验内容
针对实验二中编写的book.xml文档，写出显示该文档的CSS文档，要求对book。xml文档中的不同元素分别应用分类属性、字体属性、文本属性、颜色和背景属性。
（2)XSL实验内容
针对实验二中编写的checkout。xml文档，写出显示该文档的XSL文档,要求checkout.xml文档引用编写的XSL文档后能以图2中的显示效果显示（参考答案见附件三）。
3．预习要求及参考书目：
要求掌握课件上第6章、第7章的内容,复习课件第2章中html的相关知识.
4．实验步骤：

(1）在Windows环境中，打开xml编辑工具xmlSpy和浏览器准备好工作环境。
（2)在xmlSpy中打开book。xml，查看其中的元素信息，然后编写css文档并保存为book。css(若有错误根据xmlSpy的提示排错），然后在book。xml中引用book。css，在浏览器中打开book。xml文档查看显示结果。
(3）在xmlSpy中打开checkout.xml，查看其中的内容，然后编写XSL文档并保存为checkout.xml（若有错误根据xmlSpy的提示排错)，然后在checkout.xml中引用checkout。xml，在浏览器中打开checkout。xml文档查看显示结果。
(4）总结在设计过程遇到的错误，体会在xsl文档中使用不同的匹配路径和方法，观察实验效果。
5．实验报告要求
要求实验课程开始前撰写预习内容，实验课程结束当天撰写实验过程中设计的CSS文档和XSL文档内容、以及关于错误排查和心得体会的实验小结。
附件一：HTML实验第二部分内容参考答案

〈html〉

〈/head〉
将学习进行到底〈/h1>
〈hr size="5" width=”100％" align=”center” color="red”>
〈form actioncgi—bin/process.pl" method=”post”>
志

〉

〈button name=”cleardata” type="reset”>清除
〈/tr〉

〈xs：sequence〉

〈/xs:complexType>

〈xs：complexType name="checkoutType" mixed="false”〉
〈xs：sequence〉

lement name=”商品信息" type=”goodsType”/〉
〈/xs：sequence〉

{6｝”/>
〈/xs:restriction〉
〈/xs：simpleType〉
〈xs：simpleType name="myNumType”>
〈xs:restriction base=”xs：string"〉

〈xs：element name=”客户" type=”nameStringType"/>

pe=”transportType” default="公路运输”/〉
〈xs:element name=”运输车号” type="nameStringType”/〉

〈/xs：complexType>
〈xs:simpleType name="transportType”〉
〈xs：restriction base=”xs：string”〉

〈/xs:simpleType〉
〈xs:complexType name=”goodsType" mixed="false”〉

〉

〈xs：element name=”金额” type=”positiveDecimalType”/〉
〈/xs：sequence〉

Type>

〈/xs：simpleType〉

〈head〉
出库单信息〈/title〉
〈/head>
<body〉
<form action=”checkorder。do” method="post”〉
<h3 align="center</p><p style='height:0px;padding:0;overflow:hidden'>31、>出库单信息</h3>
〈hr color=”red” width=”100％” size="5"/〉
〈xsl：apply-templates select="出库单系统/出库单”/>

〈p align=”center"〉
请输入要查询出库单的最低限额： 〈input type=”text" value="10000"></input〉
〈/p〉
〈table align="center”〉
〈tr〉
〈td>〈input type="submit” name="提交” value="提交查询"/〉〈/td〉
<td〉<input type</p><p style='height:0px;padding:0;overflow:hidden'>32、"reset" name="重置” value=”重置查询”/〉</td>
</tr〉
</table>
</form>
</body〉
</html>
〈/xsl：template〉

〈xsl：template match="出库单”>
〈xsl:if test="总金额［value() $ge＄ 10000]”〉
〈table border="1” cellspacing=”0” align="center" width=”90％”〉
〈tr align=”center”〉
<td〉单据号:〈xsl:value—of select=”</p><p style='height:0px;padding:0;overflow:hidden'>33、@单据号"/〉</td〉
〈td>单据日期：〈xsl:value-of select=”＠单据日期”/></td〉
〈td>对应订单号：〈xsl：value-of select="对应订单号"/〉</td>
〈/tr〉
<tr align=”center”>
〈td〉仓库：〈xsl:value—of select="运输信息/仓库"/〉</td〉
<td>客户:〈xsl：value-of select="收货人联系信息/客户"/></td>
<td>收货单位:〈xsl:value-of select=”收货人联系信息/收货单位"/〉〈/td></p><p style='height:0px;padding:0;overflow:hidden'>34、
</tr〉
〈tr align="center">
<td〉联系人:〈xsl：value-of select=”收货人联系信息/联系人"/></td>
<td>联系电话:〈xsl:value-of select="收货人联系信息/联系电话"/〉</td>
<td〉发往地址:<xsl：value—of select="运输信息/发往地址"/〉〈/td〉
</tr〉
〈tr align=”center”〉
<td>运输方式：<xsl：value-of select=”运输信息/运输方式”/〉〈/td〉
〈td〉运输车号：<xsl:v</p><p style='height:0px;padding:0;overflow:hidden'>35、alue-of select="运输信息/运输车号"/〉</td>
<td>运输里程：〈xsl：value—of select="运输信息/运输里程”/>〈/td〉
〈/tr>
<tr align="center”〉
<td>送货员：〈xsl:value—of select="运输信息/送货员”/〉</td>
〈td〉司机：<xsl：value—of select="运输信息/司机"/〉〈/td>
〈td>总金额：<xsl：value-of select="总金额”/〉〈/td〉
〈/tr〉
<tr align="center”>
</p><p style='height:0px;padding:0;overflow:hidden'>36、 〈td colspan="3"><xsl：apply-templates select=”商品信息”/〉</td〉
</tr〉
〈/table>
〈/xsl：if>
〈br/〉
〈/xsl：template>

<xsl：template match="商品信息"〉
<table border=”1" cellspacing="0" align="center" width="100%”〉
<tr align=”center">
<th>商品编码</th>
<th〉名称规格〈/th〉
<th〉单位</th>
〈th〉数量</th〉</p><p style='height:0px;padding:0;overflow:hidden'>37、
<th>单价</th>
〈th〉金额〈/th〉
</tr〉
〈xsl:for-each select=”商品明细">
<tr align="center">
〈xsl:if test="金额［value(） $ge$ 10000］"〉
〈xsl:attribute name=”bgcolor">yellow</xsl：attribute〉
〈/xsl:if〉
<td〉<xsl：value—of select=”商品编码”/>〈/td>
〈td><xsl:value-of select=”名称规格"/>〈/td>
<td〉<xsl：value-of select="单位"/〉</td>
<td align=”right"〉〈xsl:value-of select=”数量”/〉</td>
<td align="right”〉〈xsl：value—of select="金额”/〉〈/td>
<td align="right"><xsl：value-of select=”金额"/>〈/td>
〈/tr〉
</xsl:for—each〉
</table〉
</xsl：template〉
〈/xsl:stylesheet>
14

</p>
</div>
</div>

<span id="LabelScript"></span>
<script src="https://m.zixin.com.cn/JS/bootstrap-collapse.js"></script>

<div class="siteInner_bg" style="margin-top: 40px; border: solid 0px red; margin-left: 0px; margin-right: 0px;">

<div>
<div style=" margin: auto; overflow:hidden;
text-align: center;">
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?6e2a21bc68316db308b5fdc9a0d11f2e";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
</div>
<div style=" height:80px; margin: auto; overflow:hidden;
text-align: center;">

<a target="_blank"
href='https://m.zixin.com.cn/ADMiddle.aspx?t=92ULKnFRa/o='>

<img src="https://www.zixin.com.cn/FileUpload/Images/81dd1a0b-02e3-435a-aa37-fbfccae9a83d.gif" width="100%" height='80'
alt="移动网页_全站_页脚广告1" />

</a>
</div> </div>
<div class="siteInner">
<p style="white-space: normal; text-align: center;"><a href="https://www.zixin.com.cn/h-33.html" target="_blank" title="关于我们" textvalue="关于我们"><span style="text-align: center;">关于我们</span></a> <span style="text-align: center;">     </span><a href="https://www.zixin.com.cn/h-37.html" target="_blank" title="便捷服务" textvalue="便捷服务">便捷服务</a>  <span style="text-align: center;">     </span><a href="https://ai.zixin.com.cn/" target="_blank" title="自信AI" textvalue="自信AI">自信AI</a> <span style="text-align: center;">      </span><a href="https://gpt.zixin.com.cn/" target="_blank" title="AI导航" textvalue="AI导航">AI导航</a>        <a href="https://www.zixin.com.cn/info/266.html" target="_blank" title="抽奖活动" textvalue="抽奖活动">抽奖活动</a></p><p style="white-space: normal; text-align: center;"><span style="color: rgb(153, 153, 153); font-family: 微软雅黑, 宋体, Arial; font-size: 12px; text-align: center; background-color: rgb(248, 248, 248);"></span><span style="text-align: center;">©2010-2026 宁波自信网络信息技术有限公司 </span><span style="text-align: center;"> </span><span style="text-align: center;">版权所有</span></p><p style="white-space: normal; text-align: center;"><span style="text-align: center;"><span style="text-align: center;"><span style="text-align: center;"><span style="text-align: center;">客服电话：<span style="text-wrap: wrap;">0574-28810668</span>  <span style="text-align: center;">投诉</span>电话：[phone]</span></span></span></span></p><p style="white-space: normal; text-align: center;"><span style="text-align: center;"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-6/9/6379033271755225397249870.png" title="gongan.png" alt="gongan.png"/></span><a href="http://www.beian.gov.cn/portal/index.do" target="_blank" textvalue="浙公网安备33021202000488号">浙公网安备33021202000488号</a>   </p><p style="white-space: normal; text-align: center;"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/4/6379256265460890686562879.png" title="icp.png" alt="icp.png"/><a href="http://beian.miit.gov.cn/" target="_blank" textvalue="浙ICP备2021020529号-1">浙ICP备2021020529号-1</a> <span style="text-align: center;"> | </span> <a href="https://dxzhgl.miit.gov.cn/dxxzsp/xkz/xkzgl/resource/qiyesearch.jsp?num=%E5%AE%81%E6%B3%A2%E8%87%AA%E4%BF%A1%E7%BD%91%E7%BB%9C%E4%BF%A1%E6%81%AF%E6%8A%80%E6%9C%AF%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8&type=xuke" target="_blank" title="浙B2-20240490" textvalue="浙B2-20240490">浙B2-20240490</a><span style="text-align: center;">  </span></p><p style="white-space: normal; text-align: left;"><span style="text-align: center; font-family: 楷体, 楷体_GB2312, SimKai; font-size: 20px;">关注我们</span><span style="text-align: center;"> ：<a href="https://www.zixin.com.cn/news/113.html" target="_blank"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/9/6379298231429297878483475.png" title="微信公众号" alt="微信公众号"/></a></span><span style="text-align: center;">    <a href="https://www.zixin.com.cn/news/113.html" target="_blank"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/5/6379257739400583672497521.png" title="抖音" alt="抖音"/></a>    <a href="https://weibo.com/zixinnetwork" target="_blank" style="color: rgb(217, 83, 79); text-align: center; white-space: normal;"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/5/6379257739400583672497523.png" title="微博" alt="微博"/></a>    <a href="https://zixinnetwork.lofter.com/" target="_blank"><img src="https://www.zixin.com.cn/FileUpload/ueditor_s/upload/2022-7/5/6379257740834991205479163.png" title="LOFTER" alt="LOFTER"/></a> </span></p>

</div>
</div>
<div style="position: fixed; bottom: 100px; right: 15px; z-index: 100000000000000000;">
<a href="https://work.weixin.qq.com/kfid/kfcb5dffb1386b26424"><img src="https://www.zixin.com.cn/FileUpload/Images/c1022425-c464-4203-b6dc-db237b2252d5.gif" style="width:36px" alt="客服"/></a>
</div>

<div class="trnav clearfix" id="navcontent" style="display: none; background-color:#3a71b1; ">
<div class="trlogoside" id="navlogo" style="display: none;">
<a href="https://m.zixin.com.cn/" title="咨信网"><img src="https://www.zixin.com.cn/FileUpload/Images/c4280cd2-fe62-449e-aeca-027ef73439f5.png" alt="咨信网"></a>
<div class="trnavclose" id="navclose">
<span></span>
</div>
</div>
<div class="navcontainer">
<div class="row">
<ul class="nav navbar-nav trnavul headercontent" id="navigation" style="margin:20px 0 0px;">

<li><a target="_parent"href="https://m.zixin.com.cn/login.aspx">登录</a></li>

<li><a target="_parent"href="https://m.zixin.com.cn/">首页 </a></li>

<li><a target="_parent"href="https://m.zixin.com.cn/booklist-0.html">分类 </a></li>

<li><a target="_parent"href="https://m.zixin.com.cn/infos.html">学堂 </a></li>

<li><a target="_parent"href="https://m.zixin.com.cn/newslist.html">公告 </a></li>

<li><a target="_parent"href="https://m.zixin.com.cn/h-0.html">帮助中心 </a></li>

</ul>
</div>
</div>
</div>
<script type="text/javascript">
function stopPropagation(e) {
var ev = e || window.event;
if (ev.stopPropagation) {
ev.stopPropagation();
}
else if (window.event) {
window.event.cancelBubble = true;//兼容IE
}
}
$("#navmore").click(function (e) {
$("#navcontent").show();
$("#navlogo").show();
stopPropagation(e);
var navcontentwidth = $("#navcontent").width();
$('#navcontent').css({ 'right': '-' + navcontentwidth + 'px' });
$("#navcontent").show().animate({ "right": 0 }, 300);
});
$(document).bind('click', function () {
var navcontentwidth = $("#navcontent").width();
$("#navcontent").animate({ 'right': '-' + navcontentwidth + 'px' }, 300, function () { $("#navcontent").hide(); });
$("#navlogo").fadeOut(300);
});
$("#navcontent").click(function (e) {
stopPropagation(e);
});
$("#navclose").click(function (e) {
var navcontentwidth = $("#navcontent").width();
$("#navcontent").animate({ 'right': '-' + navcontentwidth + 'px' }, 300, function () { $("#navcontent").hide(); });
$("#navlogo").fadeOut(300);
});
</script>

<script>
function BaseShare(title, desc, imgUrl) {
var link = "https://m.zixin.com.cn/docdown/2232505.html";
if (wx) {
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: 'wx49d3b0cb6fb382c4', // 必填，公众号的唯一标识
timestamp: '1772811381', // 必填，生成签名的时间戳
nonceStr: '98F13708210194C475687BE6106A3B84', // 必填，生成签名的随机串
signature: '81f3ca2f66ae021a0ba92bc8bb18be7a8fc157e6',// 必填，签名，见附录1
jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline', 'updateAppMessageShareData', 'updateTimelineShareData', 'hideMenuItems'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
//openTagList: ["wx-open-launch-weapp"]//H5打开小程序
});
wx.ready(function () { //需在用户可能点击分享按钮前就先调用
wx.hideMenuItems({// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
menuList: ['menuItem:share:qq', 'menuItem:favorite', 'menuItem:share:QZone', 'menuItem:share:email', 'menuItem:originPage', 'menuItem:readMode', 'menuItem:delete', 'menuItem:editTag', 'menuItem:share:facebook', 'menuItem:share:weiboApp', 'menuItem:share:brand']
});
var shareData = {
title: title, // 分享标题
desc: desc,//这里请特别注意是要去除html
link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgUrl, // 分享图标
};
wx.updateAppMessageShareData(shareData);//1.4 分享到朋友
wx.updateTimelineShareData(shareData);//1.4分享到朋友圈
});
}
}
function BaseShare(title, desc, imgUrl, link) {
if (link=="")
link = "https://m.zixin.com.cn/docdown/2232505.html";
if (wx) {
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: 'wx49d3b0cb6fb382c4', // 必填，公众号的唯一标识
timestamp: '1772811381', // 必填，生成签名的时间戳
nonceStr: '98F13708210194C475687BE6106A3B84', // 必填，生成签名的随机串
signature: '81f3ca2f66ae021a0ba92bc8bb18be7a8fc157e6',// 必填，签名，见附录1
jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline', 'updateAppMessageShareData', 'updateTimelineShareData', 'hideMenuItems'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
//openTagList: ["wx-open-launch-weapp"]//H5打开小程序
});
wx.ready(function () { //需在用户可能点击分享按钮前就先调用
wx.hideMenuItems({// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
menuList: ['menuItem:share:qq', 'menuItem:favorite', 'menuItem:share:QZone', 'menuItem:share:email', 'menuItem:originPage', 'menuItem:readMode', 'menuItem:delete', 'menuItem:editTag', 'menuItem:share:facebook', 'menuItem:share:weiboApp', 'menuItem:share:brand']
});
var shareData = {
title: title, // 分享标题
desc: desc,//这里请特别注意是要去除html
link: link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgUrl, // 分享图标
};
wx.updateAppMessageShareData(shareData);//1.4 分享到朋友
wx.updateTimelineShareData(shareData);//1.4分享到朋友圈
});
}
}
</script>

<!--footer-->
<footer class="footer">

<a target="_parent" class="footer-item" href="https://m.zixin.com.cn/">
<img class="footer-item-img" src="/Master/img/tabbar/home.png" alt="首页" />
<div class="footer-item-txt ">首页</div>
</a>
<a target="_parent" class="footer-item" id="classify" href="https://m.zixin.com.cn/bookmap.html">
<img class="footer-item-img" src="/Master/img/tabbar/category.png" alt="分类" />
<div class="footer-item-txt ">分类</div>
</a>
<a target="_parent" class="footer-item" id="case" href="https://m.zixin.com.cn/zhuantilist-.html">
<img class="footer-item-img" src="/Master/img/tabbar/case.png" alt="专题" />
<div class="footer-item-txt ">专题</div>
</a>
<a target="_parent" class="footer-item" id="my" href="https://m.zixin.com.cn/UserDefault.aspx">
<img class="footer-item-img" src="/Master/img/tabbar/my.png" alt="我的" />
<div class="footer-item-txt ">我的</div>
</a>
</footer>

<script>
$(document).ready(function () {
var arr = $(".headercontent");
for (var i = 0; i < arr.length; i++) {
(function (index) {
var url = "https://m.zixin.com.cn/header.aspx";
$.get(url + "?tp=0&t=" + (new Date()).valueOf(), function (d) {
try {
arr.eq(index).empty().html(d);
} catch (e) { }
try {
arr.html(d);
} catch (e) { }
});
})(i);
}
});
</script>

<script src="https://m.zixin.com.cn/js/jquery.lazyload.js"></script>
<script charset="utf-8">
$("img.lazys").lazyload({
threshold: 200,
effect: "fadeIn"
});
</script>
</body>
</html>