<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> body{color:#fff;font:12px/1.5 Tahoma;} #div1{width:150px;height:150px;margin:0 auto;padding:10px;background:black;border:10px solid #000;cursor:crosshair;} #div1.hover{color:red;background:#f0f0f0;border:10px solid red;} </style> <script> window.onload = function () { var oDiv = document.getElementById("div1"); oDiv.onmouseover = function () { oDiv.className = "hover" }; oDiv.onmouseout = function () { oDiv.className = ""
} }; </script> </head> <body> <div id="div1">鼠标移入改变样式，鼠标移出恢复。</div> </body> </html> 如上述代码，为什么是oDiv.className = "hover" 可以控制的div的样式，在div中并没有定义过class，还是说hover本身就是个class类？还请前辈解惑
4 回答
icecap
TA贡献3条经验 获得超2个赞
此hover非css里的伪类hover ，这个只是事先定义了一个类名叫hover的样式，鼠标进入时加上类名，离开清空类名。你可能困惑在初始化时div上并没有class，其实是js原生api，在调用className方法时没有class会自动加上class~
qq_杀意隆_0
TA贡献93条经验 获得超29个赞
在html的确没有定义过class , 这个hover类是通过JavaScript事件给div加上去的。 当鼠标移入时，动态给div添加hover类。鼠标移开时，又把hover类从div去掉。
点击展开后面1条
添加回答
举报
0/150
提交
取消