如何使用javascript更改<input>元素的背景顏色

Question

我有一個<input>元素，我想改變背景顏色。 我目前使用的代碼就是這個（但它不起作用）：

var allBlanksLoc = document.getElementById('text');
var allBlanks = allBlanksLoc.getElementsByTagName('input');

for(i=0; i<allBlanks.length; i++) {
var currentBlank = allBlanks[i];
var wordNum = blanks[i];
var blankWord = text[wordNum];
var usrAnswer = currentBlank.value;

if (usrAnswer != blankWord) {
currentBlank.style.backgroundColor = "red";
}
}

第三到最后一行是最重要的

更新：

我修復了camelCase，但它仍然不起作用。 有錯誤的想法嗎？

完整的代碼在這里： http ： //jsbin.com/imolo3/edit

Answer 1

案例很重要。 你需要的是什么

document.getElementById('test').style.backgroundColor='red';

然而

最好使用css規則並僅使用javascript將類添加到元素中。

CSS規則

input.invalid {
    background-color: red;
}

使用Javascript

element.className = 'invalid';

Answer 2

它應該是backgroundColor - 注意大寫C，JavaScript區分大小寫。

Answer 3

您確定此腳本在正確的時間運行嗎？ 如果它在頁面完全形成之前運行，則可能不存在適當的元素。

Answer 4

所以不要重復其他用戶提供的解決方案。

我個人使用JQuery（它是任何javascripter結束的地方，總體上是瀏覽器兼容性問題），它會：

$(currentBlank).css("background-color","red");