使用JavaScript更改按鈕的背景色

Question

我正在編寫一個HTML網頁，我使用了一個按鈕，並且需要在鼠標懸停時使用javascript函數更改他的背景顏色。 這是代碼。

<button onmouseover="funzione(this)">BTN</button>
<script>
    funzione(x){
        x.style.background-color=#ffffff;
    }
</script>

Answer 1

在JavaScript中，您需要獲取元素x處理程序，例如：

var x = document.getElementById("x");

但是您應該使用CCS進行此操作：

button{
    background-color: yellow;
}

button:hover{
    background-color: lime;
}

https://developer.mozilla.org/zh-CN/docs/Web/CSS/:hover

Answer 2

這是非常基本的。 您缺少關鍵字function ，並且具有訪問屬性的樣式，因此需要使用駝峰式大小寫。 最后，將顏色十六進制用引號引起來。

 function funzione(x){ x.style.backgroundColor= '#ffffff'; } 

 <button onmouseover="funzione(this)">BTN</button> 

推薦的方法是在生產環境中使用CSS，但是如果您只喜歡JavaScript並且想要探索，那就很好了。

Answer 3

如果要使用js：

 <button onmouseover="set_color(this)">BTN</button> <script> function set_color(x){ x.style.backgroundColor='red'; } </script> 

Answer 4

 function funzione(x){ x.style.backgroundColor = "#ffffff"; } 

 <button onmouseover = "funzione(this)">BTN</button> 

Answer 5

您可以在CSS中輕松，高效且更少的代碼來完成此操作。

<style type="text/css">
.myHoverButton:hover { background-color: #ffffff; }
</style>

<button id="button1" class="myHoverButton">