遇到个奇怪的问题！字符串都坚着写了!!!

动态生成一连串的span（span1,span2.....span10)后，斌给了一个div，显示都是正常的，当鼠标事件发生后，改变其中一个span的样式时，原来该span横向写的字句都变成坚向写了，再改变另一个span样式时同样变成坚的了，但上一个span又恢复正常这是什么个问题啊，单独用一个span改样式又没这个问题。for(var i=0; i<allnum;i++){
sdiv3word+=' <span id="spann3'+this.id1[i]+'" class="style2" style="position:absolute;TOP:'+(this.dx1[i]/4-this.nx1[i])+'px;LEFT:'+(this.dy1[i]/4-this.ny1[i])+'px;"onmouseover="picview('+this.id1[i]+',3)" onmouseout="pichide(3)">'+ntexts1[i]+'</span>';
}
document.getElementById('div3').innerHTML=sdiv3word;

解决方案 »

  1.   

    为了让大家看到效果专门又写了个小的<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style>
    .style1{
    color:black;
    }
    .style2{
    color:darkred;
    }
    </style>
    </head>
    <body>
    <div id="div3" style="position:absolute;TOP:0px;LEFT:0px;Z-INDEX:3;">111</div>
    <script language="javascript">
    function picview(i) {
    document.getElementById('span'+i).className="style2"
    }
    function f() {
    var sdiv3word="";
    for(var i=0; i<5;i++){
        sdiv3word+=' <span id="span'+i+'" class="style1" style="position:absolute;TOP:'+parseInt((Math.random())*100)+'px;LEFT:'+parseInt((Math.random())*100)+'px;" onmouseover="picview('+i+')" >人们'+i*100+'</span>';
    }
    document.getElementById('div3').innerHTML=sdiv3word;
    }
    f();
    </script>
    </body>
    </html>看看是激素分泌失调还是吃了伟哥?
      

  2.   

    <div id="div3" style="position:absolute;TOP:0px;LEFT:0px;Z-INDEX:3;border:1px solid red;">111</div>
    我们发现以上内容只在网页左上角一个点,而你生成的内容又在以上DIV里,无形中被压成竖的,
    <div id="div3" style="TOP:0px;LEFT:0px;Z-INDEX:3;border:1px solid red;">111</div>
    这样就没事,DIV也变成长的,而不是一个点