【免费】DHtml动态html教程资源-CSDN文库

共85个文件

gif：50个

html：25个

htm：7个

HTML

DHTML

需积分: 0 65 浏览量 2008-08-22 16:15:39 上传评论收藏 401KB ZIP 举报

资源详情

资源评论

资源推荐

收起资源包目录

DHtml动态html.zip （85个子文件）

day5_6.html 3KB

day3_3.html 5KB

day3_6l_anna.gif 1KB

day3_2.html 5KB

day3_6i_shvatz.gif 978B

day3_6h_jeanPierre.gif 724B

day3_6n_cassandra.gif 624B

jeanPierre(1).gif 724B

day4_2.html 4KB

MFM1992 43KB

thau.gif 726B

day1_1.html 4KB

day4_3.html 6KB

day5_1.html 3KB

day3_6.html 8KB

day3_6d_klug.gif 632B

day2_4a.gif 834B

jeff.gif 1KB

cassandra.gif 624B

joanne.gif 1009B

day3_6original.htm 4KB

day3_6q_joanne.gif 1009B

thechase.gif 50KB

day2_2b.gif 756B

day2_1.html 4KB

day3_6a_thau.gif 726B

day3_5.html 5KB

day3_6e_taylor.gif 726B

day4_4.html 5KB

extraDesk.gif 2KB

day5_3.html 3KB

homework.zip 47KB

tim01.gif 756B

day3_4.html 6KB

day3_6b_wendy.gif 1KB

day5_4.html 4KB

day3_6j_kristin.gif 644B

kristin.gif 644B

day1_2.html 3KB

nadav.gif 659B

taylor(1).gif 726B

day3_4truck02.gif 2KB

day2_5.html 3KB

day3_6k_tim01.gif 756B

day5_2.html 4KB

lessBasicMenu.htm 6KB

day3_6e_nadav.gif 659B

day3_6o_chris.gif 781B

day1_3.html 3KB

day2_2aspacer.gif 43B

day5_5.html 9KB

elnino.gif 5KB

spacer(1).gif 43B

day3_6p_courtney.gif 748B

day2_3.html 5KB

day4_1.html 3KB

day3_4original.htm 878B

dy3_6wendyThau.gif 4KB

day2_4b.gif 2KB

day3_6kristinTimDesk.gif 4KB

day3_6c_aaron.gif 834B

line335x1.gif 57B

wendy.gif 1KB

day3_6m_taylorShelf.gif 4KB

day2_4.html 8KB

day3_6back.gif 808B

day3_6actIsceneI.htm 9KB

courtney.gif 748B

day2_4c.gif 2KB

day2_5actIsceneI.htm 10KB

shvatz.gif 978B

day4_5.html 4KB

chris(1).gif 781B

day3_5original.htm 15KB

day2_2btim01.gif 756B

day3_1.html 5KB

day2_4d.gif 834B

day3_6f_jeff.gif 1KB

klug.gif 632B

aaron.gif 834B

anna.gif 1KB

captcursor.gif 552B

day2_2.html 8KB

day2_3screenshot.htm 4KB

homework_sea.hqx 87KB

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb_2312-80"> <meta name="GENERATOR" content="Microsoft FrontPage 3.0"> <style type="text/css">  </style> <style>  </style> <style>  </style> <title>网猴：动态HTML</title> </head> <body bgcolor="#FFFFFF"> <div id="content" style="left: 10px; top: 11px"> <table border="0" width="600" cellspacing="0"> <tr> <td bgcolor="#ffff99" colspan="2"><font size="4" color="#000000"><strong>动态HTML教程 - 第五天</strong></font></td> </tr> <tr> <td bgcolor="#FF6600" colspan="2"><em><font size="4"><a href="mailto:taylor@taylor.org">Taylor</a> </font><font size="3">1998.3.9</font></em></td> </tr> </table> <p><strong>第五页：关于Event对象</strong></p> <p>在你完全掌握dHTML前，你需要了解event对象。两种4.0浏<br> 览器都包含event对象。它在事件创立时产生，如点击一个可<br> 点击的对象，移动鼠标，或聚焦到一个窗体元素上。Event对<br> 象被创建然后传递给处理事件的函数。</p> <p>下面是event对象属性的描述，以及Netscape和IE处理它们的<br> 方式：</p> <table border="2"> <tbody> <tr> <th align="left" height="28" vAlign="baseline" width="253"><b><a name="1005913"><b>描述</b></a></b></th> <th align="left" height="28" vAlign="baseline" width="91">Microsoft 属性</th> <th align="left" height="28" vAlign="baseline" width="126"><b><b><a name="1005911">Netscape </a></b>属性</b></th> </tr> <tr> <td align="left" vAlign="baseline" width="253">代表事件类型的字符串</td> <td align="left" vAlign="baseline" width="91"><tt>type</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005567"><tt>type</tt></a> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253">代表最初发送给对象事件的字符串</td> <td align="left" vAlign="baseline" width="91"><tt>srcElement</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005571"><tt>target</tt></a> </td> </tr> <tr> <td align="left" height="67" vAlign="top" width="253"><a name="1005577">光标横坐标</a> </td> <td align="left" height="67" vAlign="top" width="91"><tt>x</tt> </td> <td align="left" height="67" vAlign="top" width="126">  <tt>x</tt> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253">光标纵坐标</td> <td align="left" vAlign="baseline" width="91"><tt>y</tt> </td> <td align="left" vAlign="baseline" width="126">  <tt>y</tt> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253"><a name="1005587">相对于页面的横坐标</a> </td> <td align="left" vAlign="baseline" width="91"><tt>clientX</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005585"><tt>pageX</tt></a> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253"><a name="1005587">相对于页面的纵坐标</a> </td> <td align="left" vAlign="baseline" width="91"><tt>clientY</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005589"><tt>pageY</tt></a> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253"><a name="1005595">相对于屏幕的横坐标</a> </td> <td align="left" vAlign="baseline" width="91"><tt>screenX</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005593"><tt>screenX</tt></a> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253"><a name="1005595">相对于屏幕的纵坐标</a> </td> <td align="left" vAlign="baseline" width="91"><tt>screenY</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005597"><tt>screenY</tt></a> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253"><a name="1005603">键代码</a> </td> <td align="left" vAlign="baseline" width="91"><tt>keyCode</tt> </td> <td align="left" vAlign="baseline" width="126">  <a name="1005601"><tt>which</tt></a> </td> </tr> <tr> <td align="left" vAlign="baseline" width="253"><a name="1005607">Netscape返回键的代码，IE 返回true或false</a> </td> <td align="left" vAlign="baseline" width="91"><tt>altKey</tt><br> <tt>ctrlKey</tt><br> <tt>shiftKey</tt> </td> <td align="left" vAlign="baseline" width="126"><a name="1005605"><tt>modifiers</tt></a></td> </tr> </tbody> </table> <p>4.0浏览器增加了一些新事件：</p> <table border="1" width="80%"> <tbody> <tr> <td width="32%"><tt>onDblClick</tt></td> <td width="68%">鼠标双击</td> </tr> <tr> <td width="32%"><tt>onKeyDown</tt></td> <td width="68%">键被按下</td> </tr> <tr> <td width="32%"><tt>onKeyPress</tt></td> <td width="68%">键被按下然后被释放</td> </tr> <tr> <td width="32%"><tt>onKeyUp</tt></td> <td width="68%">键被释放</td> </tr> <tr> <td width="32%"><tt>onMouseDown</tt></td> <td width="68%">鼠标被按下</td> </tr> <tr> <td width="32%"><tt>onMouseMove</tt></td> <td width="68%">鼠标移动</td> </tr> <tr> <td width="32%"><tt>onMouseUp</tt></td> <td width="68%">鼠标被释放</td> </tr> <tr> <td width="32%"><tt>onResize</tt></td> <td width="68%">窗口被调整大小</td> </tr> </tbody> </table> <p>4.0浏览器也增加了处理事件的新方法，虽然它们（Netscape<br> 和IE）的方式不同。Netscape用的是“时间捕捉”，IE用的<br> 是“事件气泡”。</p> <p>事件处理对Netscape处理如mouseMove或keyPress等事件是必<br> 须的，它并不隐含指向一个标记或元素。你应该告诉客户注<br> 意这些事件，并告诉它用什么函数来处理它们。下面例子<br> 用window对象的captureEvents方法来描述正在捕捉的事件：</p> <pre>window.captureEvents(Event.MOUSEMOVE);</pre> <p>注意到在不用on作为名称一部分的情况下特定事件是如何被<br> 指向的。你只是告诉Netscape注意所有发生在窗口中的事件<br> 并捕捉它们。然后你需要告诉Netscape用这些被捕捉的时间<br> 做些什么。注意on又出现了。</p> <pre>window.onMouseMove = handlerFunction; function handerFunction(yourEvent) { alert(yourEvent.screenX); }</pre> <p>这段代码是一个演示事件过程的烦人的例子。每次你移动<br> 鼠标，一个对话框会跳出来告诉你它的横坐标位置。以这种<br> 方式处理的事件传递一个指针到event对象。从这儿你可以获<br> 取必要的信息。一旦你厌倦了捕捉事件，你可以象这样释放<br> 它们：</p> <pre>window.releaseEvents(Event.MOUSEMOVE);</pre> <p>于是这种类型的事件不再被捕捉。</p> <p>IE用不同的方法处理事件，叫做“事件气泡”。在这种方<br> 法中，如果你有这样一个结构：</p> <pre><body onclick="bloorf()"> <p onclick="baz()"> <em onclick="bar()"> <strong onclick="foo()">Click on me</strong> </em> </p> </body></pre> <p>如果你点击strong标记内的文本，它接收到一个onClick事<br> 件，然后发送onclick事件给<em>标记，处理它然后发送到<br> <p>标记，等等，然后直到窗口。这样每个元素以自己的方<br> 式处理点击。但是如果你想停止气泡上传，可以取消气泡。</p> <p><script><br> function foo() { <br>      doSomeThing(); <br>      this.event.cancelBubble = true;<br> }<br> </script></p> <p>所以如果你不想让某个事件传递到所有它包含的标记，可以<br> 象上面那样阻止它。</p> <p>你可以看到，因为两种浏览器存在相似的事件，每一步都需<br> 要大量的条件化工作，而且没有简单的方式把它们映射到一<br> 个句法中。<a href="day5_6.html">>></a></p> <p><strong>动态HTML教程</strong><br> <font color=