　Dhtml 属性编程之原创笔记 -- ITDB教程库

你现在的位置 : 教程=>网页制作=>Dreamweaver=>　Dhtml 属性编程之原创笔记

文章搜索

　Dhtml 属性编程之原创笔记

时间: 2003-10-16 来自：蓝色理想

二、局部属性

在某些时候可能几个元素同时只使用一个属性，比如select中的option，在大多数情况中他们只可能有一个selected为True，其余的都为Flase，那么我们可以把它看做在这一组的option中只有一个selected，在HTML代码中我们也是这样表示的。
所以就需要一个在局部区域使用的属性来标识，它就像是一个令牌一样可以在不同的元素这间移动，这就确保了属性的唯一性，并且若是想改变属性的状态时，你不须要考虑这个属性在哪一个元素上，直接改变属性的状态。

下面我们看一下例子，由于IE6的在DOM支持上的不完善，所以写这个程序过程中有一些附加的代码，如要通过一个全局的TR变量记录属性所在的对象名称(DOM中可以通过属性.parentNode 得到)等

var oTR
bgColorOver    = document.createAttribute("bgColor")
bgColorOver.nodeValue = "red"

bgColorOut    = document.createAttribute("bgColor")
bgColorOut.nodeValue = "transparent"

function highlight(obj) {
 if (oTR)
 {
  oTR.removeAttributeNode(bgColorOver)
  oTR.setAttributeNode(bgColorOut)
  oTR.removeAttributeNode(bgColorOut)
 }
 oTR     = findParentObj(event.srcElement, "TR")
 if (oTR) oTR.setAttributeNode(bgColorOver)
}
</script>
<table border="1" bgcolor="#FFFFFF" onclick="highlight(this)" onmouseover="highlight(this)">
<tr>
    <td>序</td>
    <td>单位编码</td>
    <td>单位名称</td>
</tr>
<tr>
    <td><input type=text value=01></td>
    <td><input type=text value=DW001></td>
    <td><input type=text value=微软公司></td>
</tr> 
<tr>
    <td><input type=text value=02></td>
    <td><input type=text value=DW002></td>
    <td><input type=text value=英特公司></td>
</tr> 
<tr>
    <td><input type=text value=03></td>
    <td><input type=text value=DW003></td>
    <td><input type=text value=中国公司></td>
</tr> 
</table>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

	共 2 页，1 2

·	DHTML实例解析:用HTC统一定制表	·	DHTML实例解析:用HTC统一定制表
·	DHTML实例解析:用HTC统一定制表	·	DHTML幻灯片播放程序（一）
·	DHTML幻灯片播放程序（三）	·	DHTML幻灯片播放程序（二）
·	DHTML实例解析:用HTC统一定制表	·	认识DHTML中的“行为”组件

热点排行