碰到一件很奇怪的事情，javascript
日期：2014-05-16 浏览次数：20398 次
遇到一件很奇怪的事情，javascript
第一个问题：我的两个Class是这样定义的：
<style type="text/css">
.edit {
background:red;
onmouseout: expression(onmouseout=function (){this.style.backgroundColor = 'red'});
onmouseover: expression(onmouseover=function (){this.style.backgroundColor ='yellow'});
}
.spanStyle{
onmouseout: expression(onmouseout=function (){this.style.backgroundColor ='AliceBlue'});
onmouseover: expression(onmouseover=function (){this.style.backgroundColor ='yellow'});
}
</style>
本来的span的class 是spanStyle,鼠标指向它就变黄，移开就变aliceblue.一切正常
我要实现一个功能，可以让一个span的class变成edit,这样就可以鼠标指向它的时候变黄，移开就变红，
if(document.getElementById(num+"match").innerText != document.getElementById(num).innerText){
document.getElementById(num).className = "edit";
alert(document.getElementById(num).innerText);
alert(document.getElementById(num).className);
alert(num);
}
这一部分代码，都可以alert了，显示num的className 就是edit,可是没有任何效果，还是保持着spanStyle的样式。
真心求助
第二个问题：如果我想实现这样一个功能：对某个span的innerText进行修改，在修改之后，需要这个span立即改变样式，也就是它的class立刻改变成edit,请问这个该如何实现？十分感谢大家
------解决方案--------------------
样式和js 分开，方便以后的维护，试试这种方法：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<style type="text/css">
body,div{ margin:0px; padding:0px; }
.edit{width:200px; height:200px; background:red;}
.spanStyle{ background:AliceBlue}
</style>
<script>
function addColor(){
var edit = document.getElementById("editOne");
edit.className="edit";
edit.className= edit.className + ' spanStyle';
}
function delColor(){
var edit = document.getElementById("editOne");
edit.className = "edit";
}
</script>
</head>
<body>
<div class="edit" id="editOne" onmouseover="addColor()" onmouseout="delColor()">看我的变化</div>
</body>
</html>
第一个问题：我的两个Class是这样定义的：
<style type="text/css">
.edit {
background:red;
onmouseout: expression(onmouseout=function (){this.style.backgroundColor = 'red'});
onmouseover: expression(onmouseover=function (){this.style.backgroundColor ='yellow'});
}
.spanStyle{
onmouseout: expression(onmouseout=function (){this.style.backgroundColor ='AliceBlue'});
onmouseover: expression(onmouseover=function (){this.style.backgroundColor ='yellow'});
}
</style>
本来的span的class 是spanStyle,鼠标指向它就变黄，移开就变aliceblue.一切正常
我要实现一个功能，可以让一个span的class变成edit,这样就可以鼠标指向它的时候变黄，移开就变红，
if(document.getElementById(num+"match").innerText != document.getElementById(num).innerText){
document.getElementById(num).className = "edit";
alert(document.getElementById(num).innerText);
alert(document.getElementById(num).className);
alert(num);
}
这一部分代码，都可以alert了，显示num的className 就是edit,可是没有任何效果，还是保持着spanStyle的样式。
真心求助
第二个问题：如果我想实现这样一个功能：对某个span的innerText进行修改，在修改之后，需要这个span立即改变样式，也就是它的class立刻改变成edit,请问这个该如何实现？十分感谢大家
------解决方案--------------------
样式和js 分开，方便以后的维护，试试这种方法：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<style type="text/css">
body,div{ margin:0px; padding:0px; }
.edit{width:200px; height:200px; background:red;}
.spanStyle{ background:AliceBlue}
</style>
<script>
function addColor(){
var edit = document.getElementById("editOne");
edit.className="edit";
edit.className= edit.className + ' spanStyle';
}
function delColor(){
var edit = document.getElementById("editOne");
edit.className = "edit";
}
</script>
</head>
<body>
<div class="edit" id="editOne" onmouseover="addColor()" onmouseout="delColor()">看我的变化</div>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
