2013版网站建设与维护综合实训报告 - 图文(5)

2019-09-02 00:19

《网站建设与维护》课程综合实训报告

美化表单中的元素练习

聊天室注册页面

-18-

《网站建设与维护》课程综合实训报告

密码：

确认密码

真实姓名：

性别：

邮箱地址：

备注<p><input type=\提交\<input type=\重填\ </form> </body> </html> </p><p> ? </p><p>四、实验结果截图 </p><p>-19- </p><p>《网站建设与维护》课程综合实训报告 </p><p> </p><p> </p><p> 3.17实验17 JavaScript+CSS综合实验 </p><p>3.17.1实验类型 </p><p>验证型实验 </p><p>3.17.2实验目的 </p><p>1、熟悉CSS的使用方法，能熟练定义CSS选择器，熟练书写CSS样式表； 2、理解DOM模型，熟练掌握DOM树中节点的访问方法； 3、掌握利用JavaScript实现客户端验证的基本方法； 4、了解并会使用正则表达式进行复杂数据类型的验证； 5、掌握利用JavaScript+CSS实现样式的动态变换 </p><p>-20- </p><p>《网站建设与维护》课程综合实训报告 </p><p>3.17.3实验内容 </p><p>1、利用JavaScript实现客户端的基本数据验证； 2、利用JavaScript+CSS实现样式的动态变换； </p><p>3.17.4实验步骤 </p><p>1、部分代码如下： !doctype html> <html lang=\ <head> </p><p> <meta charset=\</p><p> <meta name=\ <meta name=\ <meta name=\ <meta name=\ <title>Document</title> <style type=\ .title{ </p><p> font-weight:bolder; </p><p> font-family:宋体; </p><p> font-size:20px; </p><p> background-color:gray; } </p><p> .lbl_title{ </p><p> text-align:right; font-weight:bold; } </p><p> .input_item{ </p><p> text-align:left; } </p><p></style> </p><p> </head> <body> <center> </p><p> <form id=\</p><p> <p> </p><p> </p><p> <p>onmouseover=\olor='#6699ff'\</p><p> onmouseout=\ </p><p> </p><p> <p>-22- </p><p></p> <br /> <p><script type="text/javascript">s("content-m");</script></p> </div> <div class="m-pages"><li><a>共6页: </a></li><li><a href='735070_4.html'>上一页</a></li><li><a href='735070.html'>1</a></li><li><a href='735070_2.html'>2</a></li><li><a href='735070_3.html'>3</a></li><li><a href='735070_4.html'>4</a></li><li class="thisclass"><a href='#'>5</a></li><li><a href='735070_6.html'>6</a></li><li><a href='735070_6.html'>下一页</a></li></div> <div class="down-word"> <div class="word-ico"></div> <div class="word-tit"> <span class="docx">2013版网站建设与维护综合实训报告 - 图文(5).doc</span> <span>将本文的Word文档下载到电脑</span> <span>下载失败或者文档不完整，请联系客服人员解决！ </span> </div> <div class="word-pic"><a href="javascript:;">下载这篇word文档</a></div> </div> </article> <div class="art-prenext"> <p>下一篇：<a href="/wenku/jiaoyu/735069.html">2016—2017学年第二学期小学六年级语文第一次质量检测</a></p> </div> <script type="text/javascript">s("like-m");</script> <div class="main-tab"><a class="on" href="javascript:;">相关阅读</a></div> <div class="tab-box"> <ul class="main-new on clearfix"> <li><a href="/wenku/jiaoyu/1151876.html" title="中国石油大学(北京)远程在线考试答案—《油气">中国石油大学(北京)远程在线考试答案—《油气</a></li> <li><a href="/wenku/jiaoyu/1229519.html" title="中国移动网上大学传输设备PTN烽火L2题库">中国移动网上大学传输设备PTN烽火L2题库</a></li> <li><a href="/wenku/jiaoyu/1287270.html" title="苏教版三年级数学下册口算练习题竖式精选（两">苏教版三年级数学下册口算练习题竖式精选（两</a></li> <li><a href="/wenku/jiaoyu/1230553.html" title="2021年高考全国乙卷文科数学试题答案">2021年高考全国乙卷文科数学试题答案</a></li> <li><a href="/wenku/jiaoyu/1150887.html" title="2019年江苏五年制专转本英语统考真题">2019年江苏五年制专转本英语统考真题</a></li> <li><a href="/wenku/jiaoyu/938557.html" title="《统计学》复习题(3)">《统计学》复习题(3)</a></li> <li><a href="/wenku/jiaoyu/1131506.html" title="大型集团党建制度（包括三会一课、党员学习、">大型集团党建制度（包括三会一课、党员学习、</a></li> <li><a href="/wenku/jiaoyu/1053491.html" title="干燥机，润磨机设备操作维护规程">干燥机，润磨机设备操作维护规程</a></li> <li><a href="/wenku/jiaoyu/1144707.html" title="2006年中国药科大学有机化学考研专业课真题及">2006年中国药科大学有机化学考研专业课真题及</a></li> <li><a href="/wenku/jiaoyu/688148.html" title="夏季减肥打造小蛮腰">夏季减肥打造小蛮腰</a></li> </ul> </div> <div class="main-tab"><a class="on" href="javascript:;">本类排行</a></div> <div class="tab-box"> <ul class="main-new on clearfix"> <li><a href="/wenku/jiaoyu/1287711.html" title="2022最新数学教师工作总结方案多篇">2022最新数学教师工作总结方案多篇</a></li> <li><a href="/wenku/jiaoyu/1230558.html" title=" 2021高考全国甲卷文科数学试题及答案"> 2021高考全国甲卷文科数学试题及答案</a></li> <li><a href="/wenku/jiaoyu/1151861.html" title="中国石油大学(北京)远程在线考试答案—《安全">中国石油大学(北京)远程在线考试答案—《安全</a></li> <li><a href="/wenku/jiaoyu/1151866.html" title="石油大学《化工过程设备设计》主观题（单数）">石油大学《化工过程设备设计》主观题（单数）</a></li> <li><a href="/wenku/jiaoyu/1151863.html" title="中国石油大学(北京)远程在线考试答案—《催化">中国石油大学(北京)远程在线考试答案—《催化</a></li> <li><a href="/wenku/jiaoyu/1092360.html" title="石油大学远程在线考试《机械制造基础》试题答">石油大学远程在线考试《机械制造基础》试题答</a></li> <li><a href="/wenku/jiaoyu/666323.html" title="广西路网项目公路工程文件材料收集立卷归档实">广西路网项目公路工程文件材料收集立卷归档实</a></li> <li><a href="/wenku/jiaoyu/718492.html" title="六年级汉语拼音总复习题（新星小学）">六年级汉语拼音总复习题（新星小学）</a></li> <li><a href="/wenku/jiaoyu/1278950.html" title="最新苏教版三年级数学上册《间隔排列》易错题">最新苏教版三年级数学上册《间隔排列》易错题</a></li> <li><a href="/wenku/jiaoyu/1271665.html" title="部编版三年级语文上册基础知识练习（2021期末">部编版三年级语文上册基础知识练习（2021期末</a></li> </ul> </div> </div> <footer class="footer"> <p class="bt-links"><a href="https://m.77cn.com.cn">手机版</a><span class="v-line">|</span><a href="https://www.77cn.com.cn">PC版</a><span class="v-line">|</span><a href="https://m.77cn.com.cn/fww">范文大全</a></p> <p>Copyright © 2019-2022 免费范文网版权所有<br/> 声明 :本网站尊重并保护知识产权，根据《信息网络传播权保护条例》，如果我们转载的作品侵犯了您的权利,请在一个月内通知我们，我们会及时删除。<br/>客服QQ：邮箱：tiandhx2@hotmail.com<br/> <a href="https://beian.miit.gov.cn/" target="_blank" rel="nofollow">苏ICP备16052595号-18</a> </p> <div style="display:none;"> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?6e245478384fea490ec3a2317ee103ab"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </div> </footer> <div class="theme-popover"> <div class="theme-poptit"> <a href="javascript:;" title="关闭" class="close">×</a> <b>注册会员免费下载</b>（下载后可以自由复制和排版） </div> <div class="theme-popbod dform">        <p class='wxpay'><a href='https://www.77cn.com.cn/user/index.php'>马上注册会员</a></p> <p class="downtxt">注：下载文档有可能“只有目录或者内容不全”等情况，请下载之前注意辨别，如果您已付费且无法下载或内容有问题，请联系我们协助你处理。<br>微信： QQ：</p> </div> </div> <div class="theme-popover-mask"></div> <script> //menu $(".header .menu").on("click", function(){ $("body").append("<div class=\"mask-bg menu-mask-bg\"></div>"); $(".menu-slide").show(); $("html,body").css({height:$(window).innerHeight(), overflow:"hidden"}); setTimeout(function(){ $(".menu-slide").css({transform:"translateX(-50px)"}); },50) }); $("body").on("click", ".menu-mask-bg", function(){ $(".menu-slide").css({transform:"translateX(-100%)"}); $(".menu-mask-bg").remove(); $("html,body").removeAttr("style"); setTimeout(function(){ $(".menu-slide").hide(); },300) }); //search $(".header .search").click(function(){ if($(".search-box").is(":hidden")){ $(this).children("i").removeClass("search-icon").addClass("close-icon"); $(".search-box").fadeIn("fast"); }else{ $(this).children("i").removeClass("close-icon").addClass("search-icon"); $(".search-box").fadeOut("fast"); } }); //nav if($(".nav").length > 0) { var nav = new Swiper(".nav",{ slidesPerView: "auto" }); } </script> <script> $(".pay1 img").click(function () { $(".wxpay").css("display", "block"); $(".alipay").css("display", "none"); $(".pay1 img").addClass("over"); $(".pay2 img").removeClass("over"); }); $(".pay2 img").click(function () { $(".wxpay").css("display", "none"); $(".alipay").css("display", "block"); $(".pay1 img").removeClass("over"); $(".pay2 img").addClass("over"); }); </script> <script type="text/javascript"> jQuery(document).ready(function($) { $('.word-pic a').click(function(){ $('.theme-popover-mask').fadeIn(100); $('.theme-popover').slideDown(200); $(".vip-up").hide(); $(".vip-pay").hide(); var downid = '735070' $('.wxpay a').click(function(){ var payurl = 'https://www.77cn.com.cn/hupipay/payment_pay_tz.php?payway=wx&aid='; payurl = payurl.replace('payment', 'youke'); var gotourl = payurl + downid location.href = gotourl; }); $('.alipay a').click(function(){ var payurl = 'https://www.77cn.com.cn/hupipay/payment_pay_tz.php?payway=ali&aid='; payurl = payurl.replace('payment', 'youke'); var gotourl = payurl + downid location.href = gotourl; }); }) $('.theme-poptit .close').click(function(){ $('.theme-popover-mask').fadeOut(100); $('.theme-popover').slideUp(200); }) }) </script> <script src="/js/gobacktop.js" type="text/javascript"></script> </body> </html>