javascript更改元素背景 [英] javascript change element background
问题描述
这是HTML
<p>texjksdgfjl sdjfg sjdfg</p>
<p> </p>
<p>texjksdgfjl sdjfg sjdfg</p>
<p> </p>
<p>texjksdgfjl sdjfg sjdfg</p>
这是JavaScript
This is the JavaScript
var d = document.getElementsByTagName("p");
for (var i=0;i<d.length;i++)
{
var text = d[i].textContent;
if (text.length===1){
d[i].style.background ='blue';
}
else {
d[i].setAttribute("backgroundColor", "red");
}
}
(显然)我可以做我想做的事 - 包含一些文本的p元素的不同背景,而不是生成为<的p元素。 p>& NBSP; < / p>
(Obviously) I can do what I want to do - different background for p elements that contain some text as opposed to p elements which are generated as < p > & nbsp; < /p >
但为什么setAttribute不起作用?
我必须错过一些非常简单的东西,但对于我的生活,我无法想象它是什么。
纯JS请,没有jQuery,没有MooTools,没有其他库。
But why doesn't the setAttribute work? I must be missing something very simple, but for the life of me I cannot imagine what it is. Pure JS please, no jQuery, no MooTools, no other library.
这是测试小提琴:在此输入链接说明
推荐答案
嗯, setAttribute
函数没有按你的想象做。
Well, the setAttribute
function doesn't do what you think it does.
如果你检查jsfiddle中的元素,你会看到这个:
If you inspect the elements in your jsfiddle, you see this:
... <p backgroundcolor="red" ...>
这肯定不是你想要的。你想要的是这样的:
and this is definitely not what you want. What you want is something like this:
setAttribute("style", "background-color: red;");
所以它会变成
... <p style="background-color: red;" ...>
这篇关于javascript更改元素背景的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!