当前位置：
文档视界 › JAVASCRIPT事件与动态页面编程
JAVASCRIPT事件与动态页面编程
HTML及网页制作练习题-完整版
1、在HTML中，（）标记不可出现在
和标记符之间。（C） （Ａ）
（Ｂ）
（Ｃ）
（Ｄ） 2、<table>属性中，rowspan定义的内容是（D） （A）单元格所跨的列数 （B）行的宽度 （C）列的高度 （D）单元格所跨的行数 3、在HTML中，正确的嵌套方式是（B）。 （Ａ）<table><td><tr></tr></td></table> （Ｂ）<table><tr><td></td></tr></table> （Ｃ）<table><tr><td></tr></td></table> （Ｄ）<table><td><tr></td></tr></table> 4、最大的标题是:（D） （A)<h7> （B)<h6> （C)<h2> （D)<h1> 5、HTML样式格式文件的后缀名是：（C） （A).asp （B).js （C).css （D).ss 6、下面哪一个标记是用于插入背景音乐的：（D） （A)<MUSIC> （B)<SWF> （C)<A> （D)<BGSOUND> 7、请指出下面正确的说法是：（C） （A)背景音乐标记符号通常插入在<body>…</body>之间 （B)可以在JavaScript语句之间插入背景音乐 （C)背景音乐最好使用MP3格式 （D)用SRC属性指明声音文件地址 8、下列哪些是视频文件。（BD） （Ａ）jpg文件 （Ｂ）avi文件 （Ｃ）mov文件 （Ｄ）mpg文件 9、HTML是一种专门用来设计网站的计算机标记语言(T F) 10、网站模版是指网站内容的总体结构和(A) A.页面格式总体规划 B.网页制作规划</p><h2>Javascript前台捕获浏览器关闭事件,后台处理一些善后工作</h2><p>Javascript前台捕获浏览器关闭事件，后台处理一些善后工作 1.使用onbeforeunload 事件捕获浏览器关闭事件 IE和火狐都支持onbeforeunload事件，但是opera不支持。 注意：不仅关闭浏览器时会触发onbeforeunload事件，刷新等事件也会触发onbeforeunload事件。 2.事件注册方法 <body onbeforeunload="CloseBrowse();"> </body> 3.使用Ajax技术向服务器异步发送需要做的善后工作 这里以登陆为例：当用户关闭浏览器时，需要把用户登陆的状态修改为‘已退出’。由于用户登陆的状态存放在服务器的数据库中，所有必需在客户端捕获浏览器关闭动作，在浏览器关闭之前，向服务器发送一个请求，当然这个的请求是异步发送的（Ajax技术）；服务器收到请求后，把当前用户的登陆状态修改为‘已退出’。 function CloseBrowse()//用户关闭浏览器 { var n = window.event.screenX - window.screenLeft; var b = n > document.documentElement.scrollWidth - 20; //可以捕获点击小差和 Alt+F4 时浏览器关闭的情况，但是不能捕获在多窗口浏览模式下，用户点多窗口模式的小差关闭浏览器的情况 if (b && window.event.clientY < 0 || window.event.altKey) { var url = "Service.asmx/UpdateLoginState"; UpdateLoginState(url); } } //使用Ajax 向服务器发送异步请求，要求服务器修改登录状态 function UpdateLoginState() { var url = "Service.asmx/UpdateLoginState"; SendRequestToWebService(url); } function SendRequestToWebService(url){ createXmlhttp(); xmlhttp.open("POST", url, true); //xmlhttp.onreadystatechange = handleStateChange; xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;"); xmlhttp.send(); } //创建XMLHttpRequest对象 function createXmlhttp() {</p><h2>Javascript鼠标触发事件大全</h2><p>Javascript鼠标事件大全 一般事件 事件浏览器支持描述 onClick IE3|N2|O3 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击 onDblClick IE4|N4|O 鼠标双击事件onMouseDown IE4|N4|O 鼠标上的按钮被按下了onMouseUp IE4|N4|O 鼠标按下后，松开时激发的事件 onMouseOver IE3|N2|O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove IE4|N4|O 鼠标移动时触发的事件 onMouseOut IE4|N3|O3 当鼠标离开某对象范围时触发的事件 onKeyPress IE4|N4|O 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象] onKeyDown IE4|N4|O 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] onKeyUp IE4|N4|O 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象] 页面相关事件 事件浏览器支持描述 onAbort IE4|N3|O 图片在下载时被用户中断 onBeforeUnload IE4|N|O 当前页面的内容将要被改变时触发的事件 onError IE4|N3|O 捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误 onLoad IE3|N2|O3 页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成 onMove IE|N4|O 浏览器的窗口被移动时触发的事件onResize IE4|N4|O 当浏览器的窗口大小被改变时触发</p><h2>网页自动跳转代码</h2><p>某网页网址变更以后，为方便不知道网址变更的朋友访问，可让原来的网页自动跳转到新的网址，代码如下： 一、普通ＨＴＭＬ页面的跳转代码： １. <meta http-equiv="refresh" content="5;URL=https://www.docsj.com/doc/1214447699.html,/rr91"> 说明： 1、上面的代码，放在网页头部的“</head>”上面； 2、数字5，是5秒以后自动跳转，可自己按照需要设置； 3、网址https://www.docsj.com/doc/1214447699.html,，就是自动跳转到的新的网址。 4.网页需要加载完毕后才能跳转。 ２.利用Javascript语言 <script> location="https://www.docsj.com/doc/1214447699.html,/rr91";</script> 说明： 本代码是网页一打开就直接跳转到https://www.docsj.com/doc/1214447699.html,/rr91上面去了！ 二、PHP跳转代码： <? //PHP自带函数，注意：使用该Header函数时必须网页未产生任何输出，此时尤其要注意空格的问题。即必须放在网页最开始处 Header("Location:https://www.docsj.com/doc/1214447699.html,/rr91"); ?> 三、ASP跳转代码： <% 'asp 自带 Response.Redirect("https://www.docsj.com/doc/1214447699.html,/rr91") %> 自动转向，也叫自动重定向。自动跳转，指当访问用户登陆到某网站时，自动将用户转向其它网页地址的一种技术。转向的网页地址可以是网站内的其它网页，也可以是其它网站。通常情况下，浏览器会收到一个网页，该页面含有自动加载一其它网页的代码。该页面有可能在服务器端被转换，这样的话，浏览器只收到一个页面，而自动转向往往意味着浏览器收到的页面具有自动将访问用户送至其它页面的功能。 对自动转向技术的合理应用包括：将用户转向到指定浏览器的网页版本；当网站的域名变更或删除后将人们转向到新域名下，等等。但现在这种技术却往往被搜索引擎优化人士用来作为提高网站的搜索引擎排名的一种手段。例如，先专门针对搜索引擎做一个高度优化的网页，也就是我们通常所说的“桥页”，然后把这个网页提交给搜索引擎来获得好的排名。</p><h2>JavaScript事件</h2><p>我的记录（JavaScript事件）JavaScript 事件冒泡简介及应用实例 一、什么是事件冒泡 在一个对象上触发某类事件（比如单击onclick事件），如果此对象定义了此事件的处理程序，那么此事件就会调用这个处理程序，如果没有定义此事件处理程序或者事件返回true，那么这个事件会向这个对象的父级对象传播，从里到外，直至它被处理（父级对象所有同类事件都将被激活），或者它到达了对象层次的最顶层，即document对象（有些浏览器是window）。 打个比方说：你在地方法院要上诉一件案子，如果地方没有处理此类案件的法院，地方相关部门会帮你继续往上级法院上诉，比如从市级到省级，直至到中央法院，最终使你的案件得以处理。 二、事件冒泡有什么作用 （1）事件冒泡允许多个操作被集中处理（把事件处理器添加到一个父级元素上，避免把事件处理器添加到多个子级元素上），它还可以让你在对象层的不同级别捕获事件。 【集中处理例子】 <div onclick="eventHandle(event)" id="outSide" style="width:100px; height:100px; background:#000; padding:50px"> <div id="inSide" style="width:100px; height:100px; background:#CCC"></div> </div> <script type="text/javascript"> //本例子只在外面盒子定义了处理方法，而这个方法一样可以捕获到子元素点击行为并处理它。假设有成千上万子元素要处理，难道我们要为每个元素加</p><h2>javascript键盘事件</h2><p>主要分四个部分 第一部分：浏览器的按键事件 第二部分：兼容浏览器 第三部分：代码实现和优化 第四部分：总结 第一部分：浏览器的按键事件 用js实现键盘记录，要关注浏览器的三种按键事件类型，即keydown，keypress和keyup，它们分别对应onkeydown、onkeypress和onkeyup这三个事件句柄。一个典型的按键会产生所有这三种事件，依次是keydown，keypress，然后是按键释放时候的keyup。 在这3种事件类型中，keydown和keyup比较底层，而keypress比较高级。这里所谓的高级是指，当用户按下shift + 1时，keypress是对这个按键事件进行解析后返回一个可打印的“!”字符，而keydown和keyup只是记录了shift + 1这个事件。[1] 但是keypress只能针对一些可以打印出来的字符有效，而对于功能按键，如F1-F12、Backspace、Enter、Escape、PageUP、PageDown和箭头方向等，就不会产生keypress事件，但是可以产生keydown和keyup事件。然而在FireFox中，功能按键是可以产生keypress 事件的。 传递给keydown、keypress和keyup事件句柄的事件对象有一些通用的属性。如果Alt、Ctrl 或Shift和一个按键一起按下，这通过事件的altKey、ctrlKey和shiftKey属性表示，这些属性在FireFox和IE中是通用的。 第二部分：兼容浏览器 凡是涉及浏览器的js，就都要考虑浏览器兼容的问题。 目前常用的浏览器主要有基于IE和基于Mozilla两大类。Maxthon是基于IE内核的，而FireFox和Opera是基于Mozilla内核的。 2.1 事件的初始化 首先需要了解的是如何初始化该事件，基本语句如下： function keyDown(){} document.onkeydown = keyDown; 当浏览器读到这个语句时，无论按下键盘上的哪个键，都将呼叫KeyDown()函数。 2.2 FireFox和Opera的实现方法 FireFox和Opera等程序实现要比IE麻烦，所以这里先描述一下。 keyDown()函数有一个隐藏的变量--一般的，我们使用字母“e”来表示这个变量。 function keyDown(e) 变量e表示发生击键事件，寻找是哪个键被按下，要使用which这个属性： e.which</p><h2>JavaScript复习题</h2><p>复习题1 一、选择题 1、写“Hello World”的正确javascript语法是 A. ("Hello World") B. "Hello World" C. ("Hello World") D. ("Hello World") 2、JS特性不包括( ) A.解释性 B.用于客户端 C.基于对象 D.面向对象 3、下列JS的判断语句中( )是正确的 (i==0)(i=0) i==0 then i=0 then 4、下列JavaScript的循环语句中( )是正确的 (i<10;i++) (i=0;i<10) i=1 to 10 (i=0;i<=10;i++) 5、下列的哪一个表达式将返回假 A.!(3<=1) B.(4>=4)&&(5<=2) C.(“a”==”a”)&&(“c”!=”d”) D.(2<3)||(3<2) 6、下列选项中,( )不是网页中的事件 7、有语句“var x=0;while(____) x+=2;”，要使while循环体执行10次，空白处的循环判定式应写为： A．x<10 B. x<=10 <20 <=20 8、JS语句 var a1=10; var a2=20; alert(“a1+a2=”+a1+a2) 将显示( )结果 +a2=30 +a2=1020+a2=a1+a2 9、将字串s中的所有字母变为小写字母的方法是( ) 、以下( )表达式产生一个0~7之间(含0,7)的随机整数. . floor()*8) 11、产生当前日期的方法是( ) (); () Date() Now() 12、如果想在网页显示后,动态地改变网页的标题( ) A.是不可能的 B.通过(“新的标题内容”) C. 通过=(“新的标题内容”) D. 通过(“新的标题内容”) 13、某网页中有一个窗体对象,其名称是mainForm,该窗体对象的第一个元素是按钮,其名称是myButton,表述该按钮对象的方法是()</p><h2>第10章 JavaScript中的事件处理</h2><p>第10章 JavaScript中的事件处理 JavaScript中的事件是浏览器响应用户操作的机制，其事件处理功能可以改变浏览器响应某些操作的标准方式，这样可开发出更具交互性、响应性和易用性的Web页面。本章将介绍JavaScript中的事件处理。其主要内容包括：事件处理的概念，常用的事件及处理、常用的简单消息输出函数以及错误处理等。 10.1 事件处理的基本概念 事件是浏览器响应用户交互操作的一种机制。浏览器本身有一套已经设计好的响应各种事件的方法，但用户有时需要开发应用程序，希望有一套机制可按需处理各种用户事件，这样就需要用到JavaScript 的事件处理机制。JavaScript的事件处理机制可以改变浏览器响应用户操作的方法，这样就可开发出更具交互性的Web页面。 10.1.1 基本概念 在JavaScript中，事件定义了用户与Web页面交互时的各种操作。通常鼠标或键盘的动作就可称之为事件，而由鼠标或键盘引发的一连串程序的动作，称之为事件驱动。对事件进行处理的程序或函数，称之为事件处理程序。 在JavaScript中对事件的处理通常由函数担任。其基本格式与函数全部一样。事件处理程序的格式一般如下所示： Function 事件处理名（参数表）{ 事件处理语句集； …… } 利用JavaScript可以在用户端实现完整的数据处理和验证工作，这样可以节省网络的传输开销。利用JavaScript实现交互功能的Web网页拥有以下3部分的内容。 （1）在head部分定义JavaScript函数，其中一些是事件处理函数，另外一些可能是为配合事件处理函数而编写的普通函数。 （2）HTML本身的各种格式控制标记。 （3）拥有句柄属性的HTML标记。 注意：句柄是界面对象的一个属性，可以存储特定事件处理函数的信息。当事件发生时，JavaScript 自动查找界面对象中相应的事件句柄，调用注册在上面的事件处理函数。 一般句柄的形式总是在事件名称前加on，一个事件句柄不但可在HTML语言中注册，也可以使用JavaScript语句注册在一个界面对象上。 注意：事件句柄可以发生实际的用户事件时由浏览器调用，也可以在JavaScript中显式地调用。</p><h2>JavaScript中按键事件的e.keyCode e.which e.charCode</h2><p>JavaScript中按键事件的e.keyCodee.whiche.charCode 1、浏览器的按键事件 浏览器有3种按键事件——keydown，keypress和keyup，分别对应onkeydown、onkeypress和onkeyup3个事件句柄。 一个典型的按键会产生所有这三种事件，依次是keydown-->keypress-->keyup。[html]view plaincopyprint? 1.<input type="text"id="text"> 2.<script> 3.document.getElementById("text").onkeypress = function() { 4.console.log("keypress"); 5.}; 6.document.getElementById("text").onkeyup = function() { 7.console.log("keyup"); 8.}; 9.document.getElementById("text").onkeydown = function() { 10.console.log("keydown"); 11.}; 12.</script> 控制台输出： keydown keypress keyup 2、浏览器的兼容性</p><p>(1)FireFox、Opera、Chrome 事件对应的函数有一个隐藏的变量e，表示发生事件。 e有一个属性e.which指示哪个键被按下，给出该键的索引值（按键码）。 静态函数String.fromCharCode()可以把索引值（按键码）转化成该键对应的的字符。eg： [html]view plaincopyprint? 1.<input type="text"id="text"> 2.<script> 3.document.getElementById("text").onkeypress = function(e) { 4.alert("按键码: " + e.which + " 字符: " + String.fromCharCode(e.which)); 5.}; 6.</script> FireFox、Opera、Chrome中输入：a 输出：按键码：97 字符：a (2)IE IE不需要e变量，window.event表示发生事件。 window.event有一个属性window.event.keyCode指示哪个键被按下，给出该键的索引值（按键码）。 静态函数String.fromCharCode()可以把索引值（按键码）转化成该键对应的的字符。eg： [html]view plaincopyprint?</p><h2>5种网页跳转方法详解</h2><p>5种网页跳转方法详解 网页自动跳转，是指当用户访问某个网页时，被自动跳转到另一个网页中去。网页自动跳转的主要作用是 ，当域名变更后，或者网站里的一个或多个网页被删除后，可以使用这种方式将用户引导到其它正常的网页 中去，从而留住用户。 不过，现在有许多人利用网页自动跳转来进行作弊，欺骗搜索引擎，从而实现提高网站搜索引擎排名的目的 。比较典型的方式是：先做一个“桥页”，当搜索引擎收录了这个桥页，并有较高排名时，桥页中再使用网 页自动跳转方式，将用户引导到用户本来无意访问的其它网页中去。 下面介绍一下5种常见的网页自动跳转方法，以及搜索引擎对这些跳转方法的辨识能力。 第一种网页自动跳转方法：Meta Refresh自动跳转法 在网页的head区域的Meta Refresh标签中，加入自动跳转代码，可实现网页的立即或延时自动跳转。 示例如下： (META http-equiv=Refresh content=10;url=https://www.docsj.com/doc/1214447699.html,/) 上述html代码中的“10”是延时跳转的时间，单位是秒。如果设为0，就表示立即跳转。 “https://www.docsj.com/doc/1214447699.html,”是跳转的目标地址，可以是同一域名下的站内相对路径，也可以是不同域名的 站外地址。 由于搜索引擎能够读取HTML，所以对于这种自动跳转方法，搜索引擎是能够自动检测出来的。</p><p>至是会不会被视为作弊，则主要看跳转时间。如果跳转时间为0，就可能会被视为作弊，从而受到惩罚。如 果有时间延迟（一般3秒以上），就会被视为正常应用。 第二种网页自动跳转方法：body onload自动跳转法 在网页加载时通过onload事件指定parent.location进行自动跳转。 示例如下： 这种方法与第一种方法一样，能够被搜索引擎识别。 第三种网页自动跳转方法：javascript自动跳转法 javascript可以实现网页的自动跳转，如果要实现立即跳转，将跳转代码放在网页的head区域即可。 示例如下： (SCRIPT language=javascript> location.replace("https://www.docsj.com/doc/1214447699.html,/html/gov2/") 其中的“https://www.docsj.com/doc/1214447699.html,/html/gov2/”是重定向目标地址。 由于搜索引擎无法解析javascript，所以搜索引擎便无法识别用javascript 脚本进行的自动跳转。 第四种网页自动跳转方法：表单自动跳转法 对于表单大家都很熟悉，就是将表单中填写的内容，提交到action参数中指定的URL地址中，目标URL再对接 收到的数据进行处理。利用这一点，我们可间接的实现网页跳转，只不过，我们并不需要提交任何表单内容 。再结合javascript脚本，可以对表单进行自动提交。 示例如下： (FORM name=form1</p><h2>html超链接实例</h2><p>HTML实例超级链接使用 2010-01-05 21:51:47 作者：来源：网友评论 0 条 HTML代码实例：详细讲解超级链接,超级链接是网站中使用比较频繁的HTML元素，因为网站的各种页面都是由超级链接串接而成，超级链接完成了页面之间的跳转。超级链接是浏览者和服务器的交互的主要手段，在后面的技术中会逐步深化学习。超级链接超级链接是网站 超级链接是网站中使用比较频繁的HTML元素，因为网站的各种页面都是由超级链接串接而成，超级链接完成了页面之间的跳转。超级链接是浏览者和服务器的交互的主要手段，在后面的技术中会逐步深化学习。超级链接 超级链接是网站中使用比较频繁的HTML元素，因为网站的各种页面都是由超级链接串接而成，超级链接完成了页面之间的跳转。超级链接是浏览者和服务器的交互的主要手段，在后面的技术中会逐步深化学习。 —注意：图片也可以做链接，将在下一章“网页中的图片”详细学习。 4.5.1 给文字添加链接 超级链接的标签是<a></a>，给文字添加超级链接类似于其他修饰标签。添加了链接后的文字有其特殊的样式，以和其他文字区分，默认链接样式为蓝色文字，有下划线。超级链接是跳转到另一个页面的，<a></a>标签有一个href属性负责指定新页面的地址。href指定的地址一般使用相对地址。 —说明：网站开发中，文档相对地址使用更为普遍。 在D:\web\目录下创建网页文件，命名为a.htm，编写代码如代码4.18所示。 代码4.18 超级链接的设置：a.htm <html> <head></p><p><title>超级链接的设置 进入列表的设置页面 
