Question

我想对几个div进行背景更改，但我不知道如何。

这是脚本：

<script>    
function hatterCsere()
{
   var x=document.getElementById("aktualis");
   x.style.backgroundColor="#666";
   x.style.color="#ffffff";
};

function hatterCserevisza(a)
{
   var y=document.getElementById("aktualis");
   y.style.backgroundColor="#CCC";
   y.style.color="#000000";     
};  
</script>

这是身体：

<div class=aktualis id="aktualis" onMouseover="hatterCserevisza();" onMouseout="hatterCsere()">
   <p>Garabonciás Karácsony</p>
</div>
<div class=aktualis id="tanar">
   <p>Új Tanár Érkezett</p>
</div>

我想使用“tanar”div上的函数。

Answer 1

您不应该在javascript中执行此操作，您应该在CSS中执行此操作，如下所示：

.aktualis:hover{
   background-color:red; /*or whatever you want it to be */
}

但是，如果你需要使用javascript，

如果每个div的类名为“aktualis”，则可以执行此操作

var elements=document.getElementsByClassName("aktualis");
for(var i=0;i<elements.length;i++){
    func_to_call(elements[i]);
}

Answer 2

使用功能参数。将参数指定为元素。然后你可以跨元素地做。例如：

function hatterCsere(element)
{
   var x=element;
   x.style.backgroundColor="#666";
   x.style.color="#ffffff";
};

function hatterCserevisza(element)
{
   var y=element;
   y.style.backgroundColor="#CCC";
   y.style.color="#000000";
};

您可以这样称呼它：

     <div class=aktualis id="aktualis" onmouseover="hatterCserevisza(this);" onmouseout="hatterCsere(this)">
        <p>Garabonciás Karácsony</p>
    </div>
    <div class=aktualis id="tanar" onmouseover="hatterCserevisza(this);" onmouseout="hatterCsere(this)">
        <p>Új Tanár Érkezett</p>
    </div>

Answer 3

同意你的第二个（SLaks）评论

<!DOCTYPE html >
 <html>
   <head>
     <title> Bla! </title>
     <style type='text/css'>
        div.bla { color:green;background-color:red; }
        div.bla:hover { color:red;background-color:green; }
     </style>
     <script type='text/javascript'>
     </script>
   </head>
   <body>
        <div class='bla'>div 1</div>
        <div class='bla'>div 2</div>
   </body>
 </html>

Answer 4

试试这个：

function hatterCsere(id)
{

var x=document.getElementById(id);
x.style.backgroundColor="#666";
x.style.color="#ffffff";
}

function hatterCserevisza(id)
{

var y=document.getElementById(id);
y.style.backgroundColor="#CCC";
y.style.color="#000000";

}

<div class='aktualis' id="aktualis" onMouseover="hatterCserevisza(this.id);" onMouseout="hatterCsere(this.id)">
            <p>Garabonciás Karácsony</p>
        </div>
        <div class='aktualis' id="tanar" onMouseover="hatterCserevisza(this.id);" onMouseout="hatterCsere(this.id)">
            <p>Új Tanár Érkezett</p>
        </div>

如何在两个以上的div元素上调用javascript函数？

4 个答案: