HTML网页设计基础实验指导书.docx

上传人:b****4 文档编号:24524867 上传时间:2023-05-28 格式:DOCX 页数:13 大小:274.40KB
下载 相关 举报
HTML网页设计基础实验指导书.docx_第1页
第1页 / 共13页
HTML网页设计基础实验指导书.docx_第2页
第2页 / 共13页
HTML网页设计基础实验指导书.docx_第3页
第3页 / 共13页
HTML网页设计基础实验指导书.docx_第4页
第4页 / 共13页
HTML网页设计基础实验指导书.docx_第5页
第5页 / 共13页
点击查看更多>>
下载资源
资源描述

HTML网页设计基础实验指导书.docx

《HTML网页设计基础实验指导书.docx》由会员分享,可在线阅读,更多相关《HTML网页设计基础实验指导书.docx(13页珍藏版)》请在冰豆网上搜索。

HTML网页设计基础实验指导书.docx

HTML网页设计基础实验指导书

HTML网页设计基础实验指导书

序号

实验项目名称

学时

实验类型

选修类别

每组学生数

1

网页设计基础及HTML基本标签

2

验证性

必修

1

2

HTML文本格式的应用

2

验证性

必修

1

3

HTML链接的应用

4

验证性

必修

1

4

HTML表格和列表的应用

4

验证性

必修

1

5

HTML表单与框架的应用

4

验证性

必修

1

6

HTML和CSS综合应用

2

设计性

必修

1

7

个人主页设计

2

设计性

必修

1

实验一 网页设计基础及HTML基本标签

【实验目的】

1.掌握利用因特网进行信息游览、搜索,下载网页、图片、文字和文件;

2.对给定的网站,能指出网站的链接结构、目录结构、页面布局方式;

3.掌握HTML的基本标签<META>标记;</p><p>【实验环境】</p><p>Windowxp操作系统,机器联网。</p><p>【实验重点及难点】</p><p>熟练使用浏览器进行浏览、搜索、下载。</p><p>【实验内容】</p><p>1、根据网站制作的需要,从网上下载网页制作时需要的文字、小图片、动画及flash。</p><p>2、上网访问实际若干网站,了解各网站的风格(主题图形形象、导航是否清晰,整体色调的搭配是否协调,主题是否突出等)、页面布局方式;在网上找出下列版面布局的结构形式:</p><p>⑴“T”结构布局</p><p>⑵“口”型(“国”字型)布局</p><p>⑷对称对比布局</p><p>⑻海报型布局</p><p>3、利用搜索引擎,浏览因特网上较为著名的5个网站,记录这些网站的名称、网站地址和以及相应的网页文件格式(扩展名);</p><p>4、查看我院WWW网站主页的源代码,收藏到收藏夹中,将其设为主页,并指出该网站的链接结构、目录结构和页面布局方式。</p><p>5、构建HTML文档“我的第一个网页”:</p><p>(1)从开始菜单启动记事本;</p><p>(2)在记事本中,录入一个HTML文档;</p><p>(3)设置该文档在最终在浏览器中显示的标题为“我的第一个网页”;</p><p>(4)在页面添加可见的文本“我的第一个网页”;</p><p>(5)使用记事本的菜单“文件”→“保存”,在“另存为”对话框中,在“保存类型”下拉列表中选择“所有文件”,录入“文件名”myfirstpage.htm,单击“保存”按钮将该页面保存到实验文件夹。</p><p>实验二HTML文本格式的应用</p><p>【实验目的】</p><p>1.掌握使用<body>标记设置网页背景颜色和文本颜色。</p><p>学习使用分段标记;</p><p>2.掌握使用<font>标记设置文字的属性;</p><p>3.掌握在网页中插入背景图片;</p><p>4.掌握在网页中插入水平线,并设置水平线的属性;</p><p>5.掌握在网页中插入背景音乐。</p><p>【实验环境】</p><p>Windowsxp</p><p>【实验重点及难点】</p><p>掌握字体、水平线等常用标记。</p><p>【实验内容】</p><p>1、使用简单内联元素进行文字处理:</p><p>(1)从开始菜单启动记事本;</p><p>(2)在记事本中,录入HTML文档;</p><p>(3)设置该文档最终显示标题为“简单文字处理”;</p><p>(4)在文档的<body>和</body>之间,插入适当元素使最终网页中显示以下内容:</p><p>这是一段文本</p><p>这是一段文本</p><p>©Microsoft®Windows2007</p><p>A=a1+a2+a3</p><p>这是一段文本</p><p>这是一段文本</p><p>提示:</p><p>1、以上文字不涉及到文字字体、大小、颜色的设置,且并不居中显示。</p><p>2、对于特殊字符,要使用字符实体。</p><p>©©版权®®注册商标</p><p>(5)紧接着步骤(4)插入的元素插入适当元素,使得最终网页上可以显示字号为5、颜色为红色、字体为“华文彩云”的下列样式文字:</p><p>这是一段文本</p><p>(6)紧接着步骤(5)插入的元素插入适当元素,使得最终网页上显示下列样式的文字(隶书、4号、绿色):</p><p>这是一段文本</p><p>(7)如果以上的每条文本之间没有换行,则在它们之间分别插入一个换行;</p><p>(8)使用步骤1-(5)中的方法保存当前HTML文档为simpleinline.htm。</p><p>2、制作一个简单的网页sy2-1.htm,用记事本编辑,内容为个人简介信息。</p><p>要求:</p><p>●搜索关键字为“个人”“主页”“简介”,标题为我的个人简介。</p><p>●背景为#33ccff,文本颜色为黑色,文本需分段表示。</p><p>3、用记事本编辑网页sy2-2.htm,内容为李白的诗“静夜思”。</p><p>要求:</p><p>每行诗为一个段落,四行文字颜色不同,字体不同。</p><p>4、通过记事本编辑网页sy2-3.htm,实现如图页面。</p><p>5、通过记事本编辑网页sy2-4.htm,实现如下页面。</p><p>图片自选,插入背景音乐“浮云.mp3”。</p><p>6、通过记事本编辑网页sy2-5.htm,实现如下页面。</p><p>实验三HTML超链接的应用</p><p>【实验目的】</p><p>1.掌握给文字添加绝对超级链接,例如:</p><p><ahref=></a>和相对超级链接,例如:</p><p><ahref=/images/1.jpg></a>;</p><p>2.掌握使用图像映像链接<AREA><MAP>;</p><p>【实验环境】</p><p>Windowsxp</p><p>【实验重点及难点】</p><p>掌握使用超级链接HTML常用标记。</p><p>【实验内容】</p><p>1、制作一个网页sy3-1.htm,用记事本编辑。</p><p>要求:</p><p>●网页名称为:</p><p>超级链接练习</p><p>●以一张图片作为背景,并且设置图片固定。</p><p>合理设置文字的颜色,和超级链接的颜色。</p><p>●插入绝对链接至长春工业大学软件学院主页。</p><p>2、利用预格式化标签,输出如下图一段文字,在页面的顶部设置相对超级链接至页面底部,在页面的底部设置相对超级链接至顶部。</p><p>3、在下图上实现图像映像链接,要求点击各省对应区域弹出该省政府网站(各省政府网址:</p><p>www.省名简拼如吉林省政府网站:</p><p>)</p><p>实验四:</p><p>HTML表格和列表的应用</p><p>【实验目的】</p><p>1.掌握表格相关标记的使用</p><p>2.掌握3种列表的定义和属性设置</p><p>【实验环境】</p><p>Windowsxp</p><p>【实验重点及难点】</p><p>掌握表格和列表相关标记的使用</p><p>【实验内容】</p><p>1、使用表格标签,制作如下图所示的页面。</p><p>要求:</p><p>●表格内容水平居中对齐,垂直居中对齐,页面标题为音乐网站。</p><p>.</p><p>●设置超级链接颜色</p><p>●点击播放,即可播放对应的音乐,音乐在网上下载。</p><p>2、使用表格标签,制作如下图所示的页面</p><p>3、用记事本编辑网页sy3-4.htm.htm,实现如下页面。</p><p>要求:</p><p>网页的名称为“列表练习”;网页有一个背景音乐,音乐自选。</p><p>实验五HTML表单和框架的应用</p><p>【实验目的】</p><p>1.掌握表单相关标记的使用;</p><p>2.掌握3个页面的框架的定义和属性设置。</p><p>【实验环境】</p><p>Windowsxp。</p><p>【实验重点及难点】</p><p>掌握表单相关标记的使用,框架页面的定义。</p><p>【实验内容】</p><p>1、建立如下表单页面:</p><p>2、建立如下框架页面,相关图片建议试着自己制作,也可从网上下载。</p><p>实验六HTML和CSS综合应用</p><p>【实验目的】</p><p>1.掌握CSS的基本语法规则。</p><p>2.掌握CSS的常用选择符。</p><p>3.掌握在网页上应用CSS的方法。</p><p>4.理解CSS的常用属性及其各项值的含义。</p><p>【实验环境】</p><p>Windowsxp。</p><p>【实验重点及难点】</p><p>掌握CSS相关标记的使用。</p><p>【实验内容】</p><p>1.CSS属性定义的缩写方法。</p><p>2.利用CSS对字体属性的设置完成下图显示样式。</p><p>3.利用CSS对文本属性的设置完成下图显示样式。</p><p>4.利用CSS对边框属性的设置完成下图显示样式。</p><p> </p><p>5.利用CSS对浮动属性的设置完成下图显示样式。</p><p>6.利用CSS对定位属性的设置完成下图显示样式。</p><p>实验七个人主页设计(综合实验)</p><p>【实验目的】</p><p>1.掌握HTML基本标记并能够综合应用</p><p>【实验环境】</p><p>Windowsxp</p><p>【实验内容及要求】</p><p>1、使用框架构建个人主页</p><p>2、网页内容要包括个人基本情况、兴趣爱好、联系方式等,通过建立导航栏实现页面导航</p><p>3、设置背景音乐及背景图片,音乐图片自选。</p><p> </p><p></p> </div> <div class="readmore" onclick="showmore()" style="background-color:transparent; height:auto; margin:0px 0px; padding:20px 0px 0px 0px;"><span class="btn-readmore" style="background-color:transparent;"><em style=" font-style:normal">展开</em>阅读全文<i></i></span></div> <script> function showmore() { $(".readmore").hide(); $(".detail-article").css({ "height":"auto", "overflow": "hidden" }); } $(document).ready(function() { var dh = $(".detail-article").height(); if(dh >100) { $(".detail-article").css({ "height":"100px", "overflow": "hidden" }); } else { $(".readmore").hide(); } }); </script> </div> <script> var defaultShowPage = parseInt("5"); var id = "24524867"; var total_page = "13"; var mfull = false; var mshow = false; function DownLoad() { window.location.href='https://m.bdocx.com/down/24524867.html'; } function relate() { var reltop = $('#relate').offset().top-50; $("html,body").animate({ scrollTop: reltop }, 500); } </script> <script> var pre = "https://file1.bdocx.com/fileroot1/2023-5/28/361912fa-2af6-452d-8a78-3ef43c7fa2be/361912fa-2af6-452d-8a78-3ef43c7fa2be"; var freepage = parseInt('13'); var total_c = parseInt('13'); var start = defaultShowPage; var adcount = 0; var adindex = 0; var adType_list = ";0;1;2;3;4;5;6;7;8;9;10;11;12;"; var end = start; function ShowSvg() { end = start + defaultShowPage; if (end > freepage) end = freepage; for (var i = start; i < end; i++) { var imgurl = pre + (i + 1) + '.gif'; var html = "<img src='" + imgurl + "' onerror=\"this.src='/images/s.gif'\" alt=\"HTML网页设计基础实验指导书.docx_第" + (i + 1) + "页\" width='100%'/>"; $("#page").append("<div class='page'>" + html + "</div>"); $("#page").append("<div class='pageSize'>第" + (i + 1) + "页 / 共" + total_c + "页</div>"); if(adcount > 0 && adType_list.indexOf(";"+(i+1)+";")>-1) { if(adindex > (adcount-1)) adindex = 0; $("#page").append("<div class='pagead' id='addiv"+(i + 1)+"'></div>"); document.getElementById("addiv"+(i + 1)+"").innerHTML =document.getElementById("adpre" + adindex).outerHTML; adindex += 1; } } start = end; if (start > (freepage - 1)) { if (start < total_c) { $("#pageMore").removeClass("btnmore"); $("#pageMore").html("亲,该文档总共" + total_c + "页,到这儿已超出免费预览范围,如果喜欢就下载吧!"); } else { $("#pageMore").removeClass("btnmore"); $("#pageMore").html("亲,该文档总共" + total_c + "页全部预览完了,如果喜欢就下载吧!"); } } } //$(document).ready(function () { // ShowSvg(); //}); </script> <div id="relate" class="container" style="padding:0px 0px 15px 0px; margin-top:20px; border:solid 1px #dceef8"> <div style=" font-size: 16px; background-color:#e5f0f7; margin-bottom:5px; font-weight: bold; text-indent:10px; line-height: 40px; height:40px; padding-bottom: 0px;">相关资源</div> <div id="relatelist" style="padding-left:5px;"> <ul> <li><em class="docx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30858782.html" title="北钻固控设备石油钻采设备螺杆泵固控设备安全基础知识.docx">北钻固控设备石油钻采设备螺杆泵固控设备安全基础知识.docx</a> </li><li><em class="docx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30855679.html" title="北钻固控设备石油钻采设备泥浆搅拌器固控设备安全基础知识.docx">北钻固控设备石油钻采设备泥浆搅拌器固控设备安全基础知识.docx</a> </li><li><em class="docx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30855449.html" title="北钻固控设备石油钻采设备泥水分离系统固控设备安全基础知识.docx">北钻固控设备石油钻采设备泥水分离系统固控设备安全基础知识.docx</a> </li><li><em class="docx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30853730.html" title="北钻固控设备石油钻采设备砂泵固控设备安全基础知识.docx">北钻固控设备石油钻采设备砂泵固控设备安全基础知识.docx</a> </li><li><em class="docx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30851616.html" title="北钻固控设备石油钻采设备石油天然气钻井固控系统固控设备安全基础知识.docx">北钻固控设备石油钻采设备石油天然气钻井固控系统固控设备安全基础知识.docx</a> </li><li><em class="pptx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30848083.html" title="卓越绩效评价准则培训(ppt).pptx">卓越绩效评价准则培训(ppt).pptx</a> </li><li><em class="pdf"/></em><a target="_parent" href="https://m.bdocx.com/doc/30848071.html" title="数字万用表结构与原理.pdf">数字万用表结构与原理.pdf</a> </li><li><em class="pdf"/></em><a target="_parent" href="https://m.bdocx.com/doc/30848037.html" title="研究生专业课-信号处理-习题库含解析.pdf">研究生专业课-信号处理-习题库含解析.pdf</a> </li><li><em class="pptx"/></em><a target="_parent" href="https://m.bdocx.com/doc/30848025.html" title="高中数学人教新课标A版选修21-阅读与思考向量.pptx">高中数学人教新课标A版选修21-阅读与思考向量.pptx</a> </li><li><em class="pdf"/></em><a target="_parent" href="https://m.bdocx.com/doc/30848023.html" title="试析“博物馆+非遗”模式下的文博创意衍生品开发路.pdf">试析“博物馆+非遗”模式下的文博创意衍生品开发路.pdf</a> </li> </ul> </div> </div> <div class="container" style="padding:0px 0px 15px 0px; margin-top:20px; border:solid 1px #dceef8"> <div style=" font-size: 16px; background-color:#e5f0f7; margin-bottom:5px; font-weight: bold; text-indent:10px; line-height: 40px; height:40px; padding-bottom: 0px;">猜你喜欢</div> <div id="relatelist" style="padding-left:5px;"> <ul> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405495.html" target="_parent" title="全程复习方略高考语文一轮复习分类题库 考点3 词语包括熟语试题 新人教版.docx">全程复习方略高考语文一轮复习分类题库 考点3 词语包括熟语试题 新人教版.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405496.html" target="_parent" title="上海利用外商直接投资的变化与影响.docx">上海利用外商直接投资的变化与影响.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405497.html" target="_parent" title="全民营销管理办法及奖励细则确定版.docx">全民营销管理办法及奖励细则确定版.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405498.html" target="_parent" title="市政工程劳务分包合同范本最新.docx">市政工程劳务分包合同范本最新.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405499.html" target="_parent" title="三角形的性质考题详解.docx">三角形的性质考题详解.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405500.html" target="_parent" title="惹人喜爱的17条原则.docx">惹人喜爱的17条原则.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405501.html" target="_parent" title="上半年总结.docx">上半年总结.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405502.html" target="_parent" title="人教版六年级英语教学计划5篇.docx">人教版六年级英语教学计划5篇.docx</a></li> <li><em class="docx"></em> <a href="https://m.bdocx.com/doc/6405503.html" target="_parent" title="舒城事业单位招聘考试真题及答案解析卷20.docx">舒城事业单位招聘考试真题及答案解析卷20.docx</a></li> </ul> </div> </div> <div style=" font-size: 16px; background-color:#e5f0f7; margin-top:20px; font-weight: bold; text-indent:10px; line-height: 40px; height:40px; padding-bottom: 0px; margin-bottom:10px;"> 相关搜索</div> <div class="widget-box pt0" style="border: none; padding:0px 5px;"> <ul class="taglist--inline multi"> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=HTML">HTML</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e7%bd%91%e9%a1%b5">网页</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e8%ae%be%e8%ae%a1">设计</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e5%9f%ba%e7%a1%80">基础</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e5%ae%9e%e9%aa%8c">实验</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e6%8c%87%e5%af%bc%e4%b9%a6">指导书</a></li> </ul> </div> <br /> <div > 当前位置:<a target="_parent" href="https://m.bdocx.com/">首页</a> > <a href="https://m.bdocx.com/booklist-00007.html">工程科技</a><span> > </span><a href="https://m.bdocx.com/booklist-0000700001.html">能源化工</a> </div> <br /> <div class="cssnone"> <iframe title="来源" src="https://m.bdocx.com/BookRead.aspx?id=%7cuuIT9V8GQTA5tuPcxEqiA%3d%3d&parto=X25NtfeU1DVAY%2bQZcXu%2f7fYE9ueo83pcp0y%2byYJ4PU%2brU2CtNirD%2fRww%2fYhjfDA2epkvjY%2b7mEp5hQe%2bVLr%2btfD2g7h3mHQ3BkMd3PHItlU510SC4Qcg%2bLJngZWIXDu2OGVPC2bQ14i88VvJlRQWJN3XiB5IIUZdiH2KCRxG%2fuM9OX4JBp%2b0b4jz6drHhfVwH%2fvDFLSCU9%2fwLjnAch2SWkyjTmqSipkP" frameborder="0" style="width: 0px; height: 0px"> </iframe> </div> <span id="LabelScript"></span> <script src="https://mstatic.bdocx.com/JS/bootstrap-collapse.js"></script> </form> <div class="siteInner_bg" style="margin-top: 40px; border: solid 0px red; margin-left: 0px; margin-right: 0px;"> <div class="siteInner"> <p style="text-align: center;">copyright@ 2008-2022 冰豆网网站版权所有</p><p style="text-align: center;">经营许可证编号:<a href="http://beian.miit.gov.cn/" target="_blank">鄂ICP备2022015515号-1</a></p><script>var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?2e77bd3f6fe91b0e21d3f22267249ee3"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })();</script><script>(function(){ var el = document.createElement("script"); el.src = "https://lf1-cdn-tos.bytegoofy.com/goofy/ttzz/push.js?81476e42bf626128cf29544ee216a8ed7deb9487dce7ed62313212129c4244a219d1c501ebd3301f5e2290626f5b53d078c8250527fa0dfd9783a026ff3cf719"; el.id = "ttzz"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(el, s); })(window)</script> </div> </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.bdocx.com/" title="冰豆网"><img src="https://www.bdocx.com/images/logo_bd.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.bdocx.com/login.aspx">登录</a></li> <li><a target="_parent"href="https://m.bdocx.com/">首页 </a></li> <li><a target="_parent"href="https://m.bdocx.com/booklist-0.html">资源分类 </a></li> <li><a target="_parent"href="https://m.bdocx.com/UserManage/Recharge.aspx?f=0"><img src="https://m.bdocx.com/images/s.gif" alt="new" class="hottip1">升级会员 <img src="https://www.bdocx.com/FileUpload/Images/48520fea-bc98-41ae-b183-84689c7075c9.gif" alt="new" class="hottip"></a></li> <li><a target="_parent"href="https://m.bdocx.com/newslist.html">通知公告 </a></li> <li><a target="_parent"href="https://m.bdocx.com/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.bdocx.com/doc/24524867.html"; if (wx) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: 'wx4f717640abfd1120', // 必填,公众号的唯一标识 timestamp: '1719418399', // 必填,生成签名的时间戳 nonceStr: '71AD16AD2C4D81F348082FF6C4B20768', // 必填,生成签名的随机串 signature: '00dc54bbcc272c335ebee3a50265244578ec401e',// 必填,签名,见附录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.bdocx.com/doc/24524867.html"; if (wx) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: 'wx4f717640abfd1120', // 必填,公众号的唯一标识 timestamp: '1719418399', // 必填,生成签名的时间戳 nonceStr: '71AD16AD2C4D81F348082FF6C4B20768', // 必填,生成签名的随机串 signature: '00dc54bbcc272c335ebee3a50265244578ec401e',// 必填,签名,见附录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> <script> $(document).ready(function () { var arr = $(".headercontent"); for (var i = 0; i < arr.length; i++) { (function (index) { var url = "https://m.bdocx.com/header.aspx"; $.get(url + "?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://mstatic.bdocx.com/js/jquery.lazyload.js"></script> <script charset="utf-8"> $("img.lazys").lazyload({ threshold: 200, effect: "fadeIn" }); </script> </body> </html>