文章分类 | 软件分类 | 最新软件 | 杀毒软件 | 实用软件  | MTV下载  | 设为首页 |
  | 下载分类 | 最近更新
您的位置: 首页 >> 文章首页 >> 网页设计 >> Html/Css >>  
Html/Css点击TOP10
·会移动的文字Marquee2006-2-9 16:55:20
·将RTF格式的文件转成HTML并在网页中显示的代码2006-2-9 14:42:08
·实现鼠标经过超链时的提示图层2006-2-5 12:31:51
·利用CSS,链接下划线也玩自定义2006-2-9 16:55:04
·DHTML对象在脚本中的引用方法2006-2-5 15:21:06
·Cool Web Scrollbars-定制网页的滚动条2006-2-5 12:43:26
·将HTML自动转为JS代码2006-2-5 12:31:55
·CSS 循序渐进(四)表里春秋2006-2-9 16:55:09
·第一章 CSS的基本认识2006-2-5 12:43:08
·表格全攻略2006-2-5 13:51:17
网页设计点击TOP10
·不要跳转或刷新 实现网页区域选择显示2006-2-6 7:47:20
·Micromedia Dreamweaver UltraDev 安装及使用教程(一)2006-2-6 6:40:51
·Fireworks4.0大内秘籍之——两仪剑法2006-2-10 10:09:55
·Flash Mx使用技巧十二则2006-2-6 7:37:27
·圆环相切效果的制作2006-2-10 10:11:39
·按钮制作2006-2-10 17:45:00
·微软Windows徽标做法一例2006-2-10 22:48:32
·十六则Dreamweaver使用快技法2006-2-9 18:03:11
·用Flash仿制Resistor Color Coder软件2006-2-5 18:51:50
·进入Flash MX组件时代之二 内置组件的使用(上)2006-2-5 11:52:41

 

DHTML对象在脚本中的引用方法
作者:我去下载           时间:2006-2-5 15:21:06


DHTML对象在脚本中的引用方法
随着DHTML(Dynamic HTML)的发展和应用,有许多网页设计者为了使自己的网页动起来,逐渐把JavaScript、VBScript等插入到自己的网页中,而客户端JavaScript、VBScript,主要引用和作用的是DHTML中的对象(确切的讲是:元素),而DHTML中对象,据不完全统计也有150多种,每个对象中的方法和属性加起来也有成千上万。
 
  这么多对象的方法和属性,使许多设计者感到没法下手,使许多初学者望而却步。通过我在网页设计上一些体会,我觉得我们只需要了解常用的一些对象的方法和属性就够了,没有必要个个掌握,用到了学,用不到了就暂可不学。但有一点我们必须掌握:既然我们要操作和使用网页中各对象,关于的网页中各对象的引用就显得尤为重要,下面我就我在网页设计上对象引用上一些体会,给大家做一简单的介绍。

DHTML对象在脚本的引用,分为绝对引用和相对引用,应用的场合不同,各有优劣,现举例说明:
<HTML>
<HEAD>
<TITLE>test</TITLE>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<SCRIPT LANGUAGE="vbscript" for="window" event="onload">
  tgname = ""
  for i = 0 to document.all.length - 1
    tgname = tgname & i & space(2) & document.all(i).tagName & vbLf
  next
  alert tgname
  alert b1.children(2).tagName
  </SCRIPT>
<style>
  .body{font-size:12px}
</style>
</HEAD>
<BODY>
<span id="A1">
  <a id="B1" href="a.htm">
    <p id="C1">
      <IMG id="D1" src="http://study.vipcn.com/InfoView/b.gif">
    </p>
    <IMG id="E1" src="http://study.vipcn.com/InfoView/c.gif">
    <br>
  </a>
</span>
<div>
  <table id="F1" border="1" width="200" height="100">
    <tbody id="G1">
      <tr id="H1">
        <td id="I1">
          <input id="J1" type="checkbox">11
        </td>
        <td id="K1">
          <input id="L1" type="checkbox">12
        </td>
      </tr>
      <tr id="M1">
        <td id="N1">
          <input name="radio1" type="radio" value="1">21
          </td>
        <td id="O1">
          <input name="radio1" type="radio" value="1">22
          </td>
        </tr>
      </tbody>
    </table>
  </div>
<form id="P1">
  <input id="Q1" type="text" size="10">
  <select id="R1" size="1">
    <option id="S1" value="1" selected>1</option>
    <option id="T1" value="2">2<option>
  </select>
  <input id="U1" type="button" value="提交">
</form>
</BODY>
</HTML>

一、绝对引用:

1、用INDEX引用,以上代码中可以看出,网页各对象是有一定顺序的,其INDEX(索引)值是从0开始,对应<HTML>标签,到document.all.length结束,对应最后一个标签<input...>。用document.all(index)或document.all[index]可以直接引用对象(VBScript不支持后一种)。

2、用id引用,如果给元素定义了id,可以直接引用对象,如:B1.href、C1.src、F1.width、H1.bgColor,J1.checked等等,但注意form里的元素不能直接引用,应这样引用:P1.Q1.value、P1.R1.value等等,当然对象前加上document.all.也可以。

3、用id引用,还可以采用这种方式:document.all("id")或document.all["id"](VBScripti不支持后一种),用这种方式有个优点,括号内可以为变量,当你访问一组相似id对象时,这一点显得尤为重要,如:document.all("A"+i),i为变量,可以访问:A1、A2...等对象。

缺点:对象的绝对引用,比较简单直观,引用准确,但缺点也很多,比如:用INDEX引用对象,网页更新后,引用就会发生错误;用id引用,代码的重复利用时,得频繁定义id,稍有不慎将导致发生错误。因此我们有必要学习相对引用。

二、相对引用:

1、相对引用可有效的利用JavaScript中this对象,在this对象的父对象和子对象中引用对象。从以上的代码,我们可以形象的看出对象的层次关系,对应于父对象和子对象关系。也可以只定义一个主要的id,其它对象通过父子关系推导出。

2、在DHTML中,window对象的级别最高,我们HTML页属于它的一个子对象document,而页中的各元素又全在:document.all集合下...我们就可以通过这一层层的关系向上、向下找到我们需要的对象,父对象是:.parentElement;如:D1.parentElement指的是对象C1;子对象集合:.children,可以通过:.children(index)找到相应对象;.firstChild,第一个子对象,.lastChild最后一个子对象,如:B1.children(2)指的是对象E1;H1.firstChild.lastChild指的是对象L1,以上的对象都可以重复利用。

缺点:对象的相对引用,虽然可以简化代码,但设计者必须很清楚的知道各对象的层次关系,不然就会出错,对象的层次因网页更新发生变化时,引用会出错。

三、引用技巧:

1、当你在引用少量对象时,用INDEX或ID绝对引用比较好;

2、当你的代码重复利用率高,且变化不大时,用相对引用比较好,且尽量多用this对象;

3、VBScript中没有this对象,使得引用当前对象不方便,可采用这种方式:eventName="JavaScript:subName(this)",将当前对象传递给VBScript的subName(this)函数;

4、衍生窗口的父窗口是:window.opener,通过这种方式可以与父窗口交换信息和操作父窗口;非衍生窗口,IE6.0以上的版本也可以通过这种的方式访问;

5、在脚本中应广泛使用:document.frames、document.images、document.forms、document.links等集合,来达到快速引用和统一变换的作用;

6、在网页中用脚本生成的静态(初始化时生成的)和动态(响应用户操作生成的)对象,也可以进行相对引用和绝对引用。
分页:
相关文章:
Copyright© 2005-2006 wqxz.com, All Rights Reserved. 购买虚拟主机请与本站联系