Question

我有这么简单的代码：

document.getElementById('tb').style.background = '#FFFFFF';

我的CSS样式表是：

.tb {
    background: #2f2f2f;
}

为什么我的Javascript代码不起作用？

我是Javascript的新手，所以如果你能解释问题而不是告诉我这个问题，我将不胜感激！

Answer 1

您的元素使用类，而不是 id 。

将其更改为：

<div id="tb">Foo bar</div>

并且：

#tb {
    background: #2f2f2f;
}

如果你想继续使用一个类，请改用这个JS：

// Get all .tb elements
var tbs = document.getElementsByClassName('tb')
i = tbs.length;
// Loop
while(i--) {
    // Change their background
    tbs[i].style.backgroundColor = "#FFFFFF";
}

或者，如果您只对第一个元素感兴趣：

document.getElementsByClassName('tb')[0].style.background = "#FFFFFF";

Answer 2

这里的主要问题是，就像zessx所说的那样，tb显然是一个类，而不是一个ID（如果我认为你的CSS样式表是正确的）。

对于CSS样式表，当您使用

时

.something {
}

语法，句号意味着它是一个类。 ID将通过使用

来引用

#something {
}

要查看哪一个确实出错，我们可能需要查看更多代码，其中包括＆＃39; tb＆＃39;使用。

在＆＃39; tb＆＃39;实际上是一个类，你应该尝试使用jQuery，在那里你可以获得某个类的元素。

Answer 3

检查以下小提琴链接

这是你的HTML代码

<div id="tb">&nbsp;</div>

JSFiddle link

此致诗

Answer 4

是的，正如其他人所说，你没有引用身份证。超级快fiddle向您展示如何使用js引用该类。

var a = document.getElementsByClassName('tb'); a[0].style.background = '#FFFFFF';

Answer 5

要获取元素并更改其样式，请使用document.getElementsByClassName('tb')[0].style.background = '#FFFFFF'。小提琴：http://jsfiddle.net/vvRs2/。

Answer 6

如果你的css看起来像这样：

.tb {
    background: #2f2f2f;
}

比“tb”是一个类（“。”是类的CSS选择器）。你需要做的是让“tb”成为一个id而不是它会起作用。

实施例： HTML：

<div id="tb">whatever</div>

CSS：

#tb {
    background: #2f2f2f;
}

或者您可以用以下代码替换您的JS：

document.getElementByClassName('tb').style.background = '#FFFFFF';

但我会推荐第一种方法。希望它有所帮助。

通过getElementById更改CSS无法正常工作

6 个答案: