比如：用js来控制：：
<script language=javascript>
switch(type)
{
case 'text':
style.backgroundColor="red"
break
case 'password':
style.backgroundImage="url(BG.gif)"
break
case 'submit':
style.backgroundColor="blue"
style.color="white"
break
case 'reset':
style.backgroundColor="navy"
style.color="white"
break
case 'radio':
style.backgroundColor="hotpink"
break
case 'checkbox':
style.backgroundColor="green"
break
case 'button':
style.backgroundColor="lightblue"
break
default: //others use default style.
}
</script>
<HTML><HEAD>
<TITLE>New Document </TITLE>
<script type="text/javascript">
//在鼠标显示一个层，该层的内空为div2的内容
function showTip(){
var div3 = document.getElementById('div3')//将要弹出的层
div3.style.display="block"//div3初始状态是不可见的，设置可为可见
//window.event代表事件状态，如事件发生的元素，键盘状态，鼠标位置和鼠标按钮状.
//clientX是鼠标指针位置相对于窗口客户区域的 x 坐标，其中客户区域不包括窗口自身的控件和滚动条。
div3.style.left=event.clientX+10 //鼠标目前在X轴上的位置，加10是为了向右边移动10个px方便看到内容
div3.style.top=event.clientY+5
div3.style.position="absolute"//必须指定这个属性，否则div3层无法跟着鼠标动
var div2 =document.getElementById('div2')
div3.innerText=div2.innerHTML
}
//关闭层div3的显示
function closeTip(){
var div3 = document.getElementById('div3')
div3.style.display="none"
}
//控制层div2显示的开关
function switchDIV(){
if(div2.style.display=='block'){
div2.style.display='none'
}
else{
div2.style.display='block'
}
}
</script>
</HEAD>
<BODY>
<a href="#" onmousemove="showTip()" onmouseout="closeTip()" onclick="switchDIV()">链接</a>
<div id="div2" style="display:nonebackground-color:green">
<h1 color="blue">我是在div2里面的一句话!</h1>
</div>
<div id="div3" style="display:nonebackground-color :pinkwidth:250height:50">
</div>
</BODY>
</HTML>
![js中a.b与a[b]除了书写外,有什么区别](/aiimages/js%E4%B8%ADa.b%E4%B8%8Ea%5Bb%5D%E9%99%A4%E4%BA%86%E4%B9%A6%E5%86%99%E5%A4%96%2C%E6%9C%89%E4%BB%80%E4%B9%88%E5%8C%BA%E5%88%AB.png)
