五JavaScript事件与对象解析.docx

资源描述

五JavaScript事件与对象解析.docx

《五JavaScript事件与对象解析.docx》由会员分享，可在线阅读，更多相关《五JavaScript事件与对象解析.docx（56页珍藏版）》请在冰豆网上搜索。

五JavaScript事件与对象解析.docx

五JavaScript事件与对象解析

第10章JavaScript事件与对象

JavaScript的一个重要特点是基于对象。

对象将程序数据和操作封装在一起，使得程序开发更加直观、模块化和可复用，它的应用大大简化了JavaScript程序的设计。

JavaScript语言是基于对象的（Object-Based），而不是面向对象的（object-oriented）。

之所以说它是一门基于对象的语言，主要是因为它没有提供象抽象、继承、重载等有关面向对象语言的许多功能。

而是把其它语言所创建的复杂对象统一起来，从而形成一个非常强大的对象系统。

虽然JavaScript语言是一门基于对象的，但它还是具有一些面向对象的基本特征。

它可以根据需要创建自己的对象，从而进一步扩大JavaScript的应用范围，增强编写功能强大的Web文档。

事件是浏览器响应用户操作的机制，它提供与浏览器窗口和其中的网页进行交互的接口。

在浏览器中，事件主要由用户的操作产生，包括加载页面、输入数据、鼠标和键盘操作等。

JavaScript可以捕获这些事件，并进行相应地处理，从而可以开发出交互性和易用性更强的HTML页面。

本章主要讲述使用JavaScript处理常用事件的方法，包括如何利用事件与浏览器窗口进行交互；本章还重点介绍了JavaScript对象的概念、常用JavaScript内置对象和浏览器对象的使用方法。

学习目标

在学习完本章之后，读者应能理解和掌握以下几点：

●事件的概念，常用的JavaScript事件及其含义；

●如何根据网页设计需要编写事件处理程序；

●什么是对象，对象的属性和方法的含义；

●几个JavaScript内置对象的功能及使用方法；

●几个浏览器对象的功能及使用方法；

10.1事件及其处理

事件是指定活动发生时生成的信号，主要由用户操作产生。

用户在超链接上单击、改变文本框内容和页面关闭等都是事件的实现。

表10.1列出了常用的JavaScript事件。

表10.1常用的JavaScript事件

事件

描述

click

单击事件

dbclick

双击事件

mouseover

鼠标移入事件

Mouseout

鼠标移出事件

Focus

获得输入焦点事件

blur

失去输入焦点事件

submit

表单提交事件

reset

表单重置事件

load

加载页面事件

unload

离开页面事件

不同的HTML元素可以产生不同的事件，每个事件都有与之对应的事件处理属性（以“on+事件名”的方式命名），只需为其指定（编写）事件对应的事件处理程序，就可以处理这个事件。

常见的HTML元素及其事件处理属性如表10.2所示。

表10.2常用HTML元素的事件处理属性

HTML元素

HTML标记

事件处理属性

表单

onSubmit,onReset

文本框

onFocus,onBlur按钮<inputtype=button/submit/reset>onClick单选框/复选框<inputtype=radio/checkbox>onClick菜单<select>onFocus,onBlur超链接<a>onMouseOver,onMouseOut,onClick文档主体<body>onLoad,onUnload为这些事件处理属性设置处理程序的格式为：on事件名=事件处理函数（或JavaScript语句）事件处理程序也可用事件处理函数表示，也可以直接使用JavaScript语句。下面通过例子说明这2种方法。1在函数中处理事件使用范例为普通按钮的click事件设置事件处理函数ShowMsg。ShowMsg函数用于弹出一个消息对话框。当用户单击“确定”按钮时，调用ShowMsg函数弹出一个消息对话框：<html><head><title>事件处理函数</title><scriptlanguage="JavaScript"></script></head><body><form><inputtype="button"value="确定"onClick="ShowMsg（'坚持就是胜利！'）"></form></body></html>显示结果如图10.1所示的就是单击“确定”时的显示结果。图10.1事件处理程序2直接使用JavaScript语句处理事件使用范例若采用“直接使用JavaScript语句处理事件”的方式，只需在<input>标签的onClick属性中直接指定JavaScript代码“alert（'坚持就是胜利！'）”，上例的代码应改为：<html><head><title>click事件</title></head><body><form><inputtype="button"value="确定"onClick="alert（'坚持就是胜利！'）"></form></body></html>10.2JavaScript的常用事件在前面的章节中已经介绍了click事件，这只是最简单的事件。在JavaScript中提供了更多的事件，恰当地使用这些事件可以进一步增强页面交互功能。下面介绍几组最常用的事件：●click事件与dbclick事件●load事件与unload事件●mouseover事件与mouseout事件●focus事件与blur事件●submit事件与reset事件10.2.1click事件与dbclick事件click事件在鼠标单击的时候发生。点击按钮（普通按钮、提交按钮或重置按钮）、单选框、复选框和超链接时都会产生这个事件。dbclick事件在鼠标双击的时候发生。双击超链接或其他页面元素时会产生这个事件。在InternetExplorer中，响应dbclick事件前会产生一个click事件。使用范例制作在线测试页面。显示一道问题，给出三个答案选项，用户通过点击答案前的单选按钮来回答。点击按钮后弹出一个提示，告诉用户选择是否正确。实现的方法如下：在每个单选按钮的<input>标签中设置onClick属性，响应click事件。当点击单选按钮时，调用ShowMsg函数，弹出一个消息对话框告诉用户选择结果。当用户点击3个按钮时，分别提示“不对,再想想”、“正确,真聪明”和“错了,加油”。<html><head><title>在线测试</title><scriptlanguage="JavaScript"></script></head><body>鼠标单击时发生的事件是：<form><inputtype="radio"name="answer"onClick="ShowMsg（'不对,再想想'）">load事件<inputtype="radio"name="answer"onClick="ShowMsg（'正确,真聪明'）">click事件<inputtype="radio"name="answer"onClick="ShowMsg（'错了,加油'）">dbclick事件</form></body></html>显示结果如图10.2所示的就是在线测试页面的显示效果。图10.2在线测试页面选择正确答案后，浏览器弹出“正确，真聪明”的提示，如图10.3所示。图10.3选择正确的提示关闭消息对话框，选择一个错误的答案，浏览器弹出“不对，再想想”的提示，如图10.4所示。图10.4选择错误的提示10.2.2load事件与unload事件load事件发生在浏览器加载完页面时，即网页刚被显示出来时。unload事件与load事件相对应，发生在离开（关闭）网页时。通常在<body>标签中设置这2个事件的处理属性。使用范例通过设置<body>标签的onLoad和onUnload属性，打开和关闭窗口时进行提示：<html><head><title>load和unload事件</title></head><bodyonLoad="alert（'阁下光临寒舍，令蓬荜生辉!'）"onUnload="alert（'轻轻的你走了，正如你轻轻的来。'）"></body></html>显示结果打开页面时弹出欢迎信息，如图10.5所示。图10.5打开窗口时的消息。关闭浏览器窗口后弹出另一个消息提示框，如图10.6所示。图10.6关闭窗口时的消息。10.2.3mouseover和mouseout事件1.mouseover和mouseout是鼠标事件。当鼠标移动到HTML元素（比如超链接）所在区域时，会触发mouseover事件；当鼠标从HTML元素所在区域移出时，会触发mouseout事件。使用范例通过设置<a>标签的onMouseOver和onMouseOut属性，当鼠标移到用<a>标记的文字上时，在状态栏显示“鼠标移入”；当鼠标移出时，在状态栏显示“鼠标移出”：<html><head><title>鼠标事件</title><scriptlanguage="JavaScript"></script></head><body><aonMouseOver="showStatus（'鼠标移入'）"onMouseOut="showStatus（'鼠标移出'）">测试一下</a></body></html>显示结果当鼠标移入的显示效果如图10.7所示，浏览器左下角的状态栏中显示“鼠标移入”字样。图10.7鼠标移入的效果当鼠标移出的显示效果如图10.8所示，状态栏中显示“鼠标移出”字样。图10.8鼠标移出的效果2.通过id，实现mouseover和mouseout事件当鼠标放到标签中的时候div显示红色背景，鼠标离开时div显示绿色背景：（主要通过id号改变元素的属性）显示结果：鼠标离开时鼠标放上去时<htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>无标题文档</title><style>#div1{width:300;height:300;background-color:#FF0000;}</style><script>functiontoGreen（）{document.getElementById（'div1'）.style.width='400px';document.getElementById（'div1'）.style.height='400px';document.getElementById（'div1'）.style.background='green';}functiontoRed（）{document.getElementById（'div1'）.style.width='300px';document.getElementById（'div1'）.style.height='300px';document.getElementById（'div1'）.style.background='red';}</script></head><body><divid="div1"onmouseover="toGreen（）"onmouseout="toRed（）"></div></body></html>10.2.4focus事件与blur事件一个HTML元素，比如文本框或下拉菜单，当用鼠标或键盘选中，即获得焦点时，就会产生一个focus事件。相对的，当它失去焦点时，就会产一个blur事件。使用范例通过设置<input>标签的onFocus和onBlur属性，当文本框获得焦点时，在状态栏上显示“用户名由字母和数字组成”；当文本框失去焦点时，清除状态栏上的内容。<html><head><title>focus和blur事件</title><scriptlanguage="JavaScript"></script></head><body><form>用户名：<inputtype="text"name="user"onFocus="showStatus（'用户名由字母和数字组成'）"onBlur="showStatus（''）"></form></body></html>显示结果如图10.9所示在文本框内单击时，浏览器左下角的状态栏上显示“用户名由字母和数字组成”。图10.9文本框获得焦点单击文本框外的空白区域，状态栏清空，如图10.10所示。图10.10文本框失去焦点10.2.5submit和reset事件submit和reset事件都是与表单相关的事件。当填写完一个表单，进行提交时就会产生submit事件。submit事件的处理程序通常是用来检查表单项目的有效性，比如判断表单是否填写完整。reset事件发生在用户重置表单内容时。当用户对输入的内容不满意时，就要进行重置，将表单内容还原到填写前的样子。使用范例分别在<form>标签的onSubmit和onReset属性中设置submit和reset事件的处理函数，让表单提交和重置时弹出确认对话框。提交表单时，调用mySubmit（）函数处理submit事件。在mySubmit函数中，首先调用confirm（）函数弹出确认对话框，若选择“确定”，通过returnconfirm（"确定提交吗？"）;语句返回true值，提交继续进行；否则取消提交。重置表单的操作与提交类似。<html><head><title>submit和reset事件</title><scriptlanguage="JavaScript"></script></head><body><formname="register"action="mailto:vyxl@"onSubmit="returnmySubmit（）"onReset="returnmyReset（）">用户名：<inputtype="text"name="user"> <inputtype="submit"value="提交"><inputtype="reset"value="重置"></form></body></html>显示结果如图10.11所示的是点击“提交”按钮时的显示结果。图10.11提交表单如图10.12所示的是点击“重置”按钮时的显示结果。图10.12重置表单10.3JavaScript对象基础对象是现实世界中存在的客观事物，例如人、电脑和湖泊等。对象也存在于计算机和网络世界中。HTML页面和其中包含的网页元素都可以看作是对象。10.3.1对象的基本概念JavaScript中的对象是由属性（properties）和方法（methods）两个基本的元素的构成的。前者是对象在实施其所需要行为的过程中，实现信息的装载单位，从而与变量相关联；后者是指对象能够按照设计者的意图而被执行，从而与特定的函数相联。下面分别解释这两个概念。●属性简单地讲，属性是用于描述对象的内部变量。这些变量中保存着对象自身的信息。例如，length是一个字符串对象的属性，储存着字符串的长度信息。●方法方法是一个对象自己所属的函数，可以直接访问对象的内部变量。10.3.2引用对象的途径一个对象要真正地被使用，可采用以下几种方式获得：●引用JavaScript内部对象；●由浏览器环境中提供；●创建新对象。这就是说一个对象在被引用之前，这个对象必须存在，否则引用将毫无意义，而出现错误信息。从上面中我们可以看出JavaScript引用对象可通过三种方式获取。要么创建新的对象，要么利用现存的对象10.3.3有关对象操作语句在JavaScript中提供了几个用于操作对象的语句和关键字及运算符。（1）for...in语句格式如下：for（对象属性名in已知对象名）该语句的功能是用于对已知对象的所有属性进行操作的控制循环。它是将一个已知对象的所有属性反复置给一个变量；而不是使用计数器来实现的。该语句的优点就是无需知道对象中属性的个数即可进行操作。例：下列函数是显示数组中的内容：FunctionshowData（object）for（varX=0;X<30;X++）document.write（object[i]）；该函数是通过数组下标顺序值，来访问每个对象的属性，使用这种方式首先必须知道数组的下标值，否则若超出范围，则就会发生错误。而使for...in语句，则根本不需要知道对象属性的个数，见下：FunctionshowData（object）for（varpropinobject）document.write（object[prop]）；使用该函数时，在循环体中，for自动将的属性取出来，直到最后为此。（2）with语句使用该语句的意思是：在该语句体内，任何对变量的引用被认为是这个对象的属性，以节省一些代码。withobject{...}所有在with语句后的花括号中的语句，都是在后面object对象的作用域的。（3）this关键字this是对当前的引用，在JavaScript由于对象的引用是多层次，多方位的，往往一个对象的引用又需要对另一个对象的引用，而另一个对象有可能又要引用另一个对象，这样有可能造成混乱，最后自己已不知道现在引用的那一个对象，为此JavaScript提供了一个用于将对象指定当前对象的语句this。（4）new运算符虽然在JavaScript中对象的功能已经是非常强大的了。但更强大的是设计人员可以按照需求来创建自己的对象，以满足某一特定的要求。使用new运算符可以创建一个新的对象。其创建对象使用如下格式：newObject=newObject（Parameterstable）;其中newObject创建的新对象：object是已经存在的对象；parameterstable参数表；new是JavaScript中的命令语句。如创建一个日期新对象newDate=newDate（）birthday=newDate（December12.1998）之后就可使newDate、birthday作为一个新的日期对象了。10.3.4对象属性的引用对象属性的引用可由下列三种方式之一实现：（1）使用点（.）运算符university.name=“云南省”university.city=“昆明市”university.date="1999"其中university是一个已经存在的对象，name、city、date是它的三个属性，并通过操作对其赋值。例如，网页的背景色由document对象的bgColor属性表示，要将背景色改为蓝色，可以使用下面的语句：document.bgColor="blue";document的write方法可以向浏览器输入HTML文本，若要在浏览器中显示“早上好！”这句话，可以使用下面的语句：document.write（"早上好!"）;（2）通过对象的下标实现引用university[0]=“云南”university[1]=“昆明市”university[2]="1999"通过数组形式的访问属性，可以使用循环操作获取其值。Functionshowunievsity（object）for（varj=0;j<2;j++）document.write（object[j]）若采用For...in则可以不知其属性的个数后就可以实现：Functionshowmy（object）for（varpropinthis）docament.write（this[prop]）;（3）通过字符串的形式实现university["Name"]=“云南”university["City"]=“昆明市”university["Date"]="1999"10.3.5对象方法的引用在JavaScript中对象方法的引用是非常简单的。ObjectName.methods（）实际上methods（）=FunctionName，方法实质上是一个函数。如引用university对象中的showmy（）方法，则可使用：document.write（university.showmy（））或：document.write（university）如果在程序中要多次使用某个对象的属性和方法时，可以使用with语句简化书写。在“语句块”中，可以直接使用对象的属性名和方法名，而不需加“对象名.”的前缀。例如：document.bgColor="blue";document.write（"早上好!"）;可以简写为with（document）{bgColor="blue";write（"早上好!"）;}10.4JavaScr </div> <div class="readmore" onclick="showmore()" style="background-color:transparent; height:auto; margin:0px 0px; padding:20px 0px 0px 0px;">展开阅读全文</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 = "3440144"; var total_page = "56"; var mfull = false; var mshow = false; function DownLoad() { window.location.href='https://m.bdocx.com/down/3440144.html'; } function relate() { var reltop = $('#relate').offset().top-50; $("html,body").animate({ scrollTop: reltop }, 500); } </script> <script> var pre = "https://file1.bdocx.com/fileroot1/2022-11/22/3956a8e9-b0b1-4645-8735-c0ba7f36ed18/3956a8e9-b0b1-4645-8735-c0ba7f36ed18"; var freepage = parseInt('20'); var total_c = parseInt('56'); 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;13;14;15;16;17;18;19;"; 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=\"五JavaScript事件与对象解析.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><a target="_parent" href="https://m.bdocx.com/doc/30873321.html" title="linux-centos7-服务器命令教程第11章DNS服务器PPT课件.ppt">linux-centos7-服务器命令教程第11章DNS服务器PPT课件.ppt</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30872776.html" title="野外岩石的鉴定步骤.doc">野外岩石的鉴定步骤.doc</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30872706.html" title="公共自行车租赁系统车辆监管平台设计与实现.pptx">公共自行车租赁系统车辆监管平台设计与实现.pptx</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30872610.html" title="小磨香油的全方位市场调研.docx">小磨香油的全方位市场调研.docx</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30871969.html" title="警察进校园PPT课件警察节.pptx">警察进校园PPT课件警察节.pptx</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30871950.html" title="化学气相沉积法PPT.ppt">化学气相沉积法PPT.ppt</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30871902.html" title="抗生素的合理应用课件 (1).ppt">抗生素的合理应用课件 (1).ppt</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30871761.html" title="单糖的构型.ppt">单糖的构型.ppt</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30871748.html" title="明代短篇小说.ppt">明代短篇小说.ppt</a> </li><li><a target="_parent" href="https://m.bdocx.com/doc/30871720.html" title="安全人机工程学【PPT】.ppt">安全人机工程学【PPT】.ppt</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> <a href="https://m.bdocx.com/doc/447326.html" target="_parent" title="文化服务业报表制度.docx">文化服务业报表制度.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447327.html" target="_parent" title="小学主题班会说课稿合集12篇.docx">小学主题班会说课稿合集12篇.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447328.html" target="_parent" title="FIDIC土木工程施工分包合同条件.docx">FIDIC土木工程施工分包合同条件.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447329.html" target="_parent" title="套卷福建省福州市届高三下学期毕业班质检英语试题扫描版.docx">套卷福建省福州市届高三下学期毕业班质检英语试题扫描版.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447330.html" target="_parent" title="税务个人总结精选.docx">税务个人总结精选.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447331.html" target="_parent" title="天津市部分区高三上学期期中考历史试题.docx">天津市部分区高三上学期期中考历史试题.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447332.html" target="_parent" title="山东省潍坊市中考地理试题与答案.docx">山东省潍坊市中考地理试题与答案.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447333.html" target="_parent" title="通信网络设备维修企业资质评定程序.docx">通信网络设备维修企业资质评定程序.docx</a></li> <li> <a href="https://m.bdocx.com/doc/447334.html" target="_parent" title="班主任班级管理经验.docx">班主任班级管理经验.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=JavaScript">JavaScript</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e4%ba%8b%e4%bb%b6">事件</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e5%af%b9%e8%b1%a1">对象</a></li> <li class="tagPopup"><a target="_parent" class="tag tagsearch" rel="nofollow" href="https://m.bdocx.com/search.html?q=%e8%a7%a3%e6%9e%90">解析</a></li> </ul> </div> <div > 当前位置：<a target="_parent" href="https://m.bdocx.com/">首页</a> > <a href="https://m.bdocx.com/booklist-00001.html">IT计算机</a> > <a href="https://m.bdocx.com/booklist-0000100002.html">计算机软件及应用</a> </div> <div class="cssnone"> <iframe title="来源" src="https://m.bdocx.com/BookRead.aspx?id=vheAFOSP0aE%3d&parto=%2fzzxIkBilKxcbOBgHVxWXtSSKYCQF8xbUZvcCUTd%2bzbdyHTGsO8EHKY7qRrsHAADo1LYWEmjYavPYtU9EE4oQw7aUKSqaBUzDXiH2lNZciW0LijXwM0KzHMxP4C69XOL3W0ZOYCZQlmFdu1QjO4zsL5Ttl%2bYrN6AsT3N%2bwIkgjhFvuBZ0mPL5K%2bM51a11AvtWItrd03uriVgRuR11%2bN%2bZDD3GxYSyHSD" frameborder="0" style="width: 0px; height: 0px"> </iframe> </div> <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"> copyright@ 2008-2022 冰豆网网站版权所有经营许可证编号:<a href="http://beian.miit.gov.cn/" target="_blank">鄂ICP备2022015515号-1</a><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"> </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/3440144.html"; if (wx) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: 'wx4f717640abfd1120', // 必填，公众号的唯一标识 timestamp: '1730969877', // 必填，生成签名的时间戳 nonceStr: 'A1D0C6E83F027327D8461063F4AC58A6', // 必填，生成签名的随机串 signature: '5e0dadfbce1fd2f5e564704586b6fe4fd6b53903',// 必填，签名，见附录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/3440144.html"; if (wx) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: 'wx4f717640abfd1120', // 必填，公众号的唯一标识 timestamp: '1730969877', // 必填，生成签名的时间戳 nonceStr: 'A1D0C6E83F027327D8461063F4AC58A6', // 必填，生成签名的随机串 signature: '5e0dadfbce1fd2f5e564704586b6fe4fd6b53903',// 必填，签名，见附录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>