使用JavaScript在HTML中更改Text BackGround Color

Question

<ul>
    <li>
        <span class="name">Tortilla de blé</span>
    </li>
</ul>

这是原始来源。我需要更改标签中背景颜色。 我已经使用了css属性background-color。但它正在改变整个列表项的颜色。 我只能使用javascript更改背景颜色。

var ea = document.getElementsByClassName('name');
for(var i = 0; i < ea.length; i++)
    ea[i].style.backgroundColor = "yellow";

（改变了旧剧本，因为这不正确，写错了）

我的结果：

预期结果 我该怎么做才能突出显示标签中的文字，而不是整个标签。

我通过编辑源代码产生了预期的结果，如下所示：

<ul>
    <li>
        <span class="name"><font style="bakground-color:yellow">Tortilla de blé</font></span>
    </li>
</ul>

通过将字体标记嵌入到javascript无法实现的文本中。 我是借助Google Chrome的 Inspect Element 功能完成此操作的

Answer 1

您的js示例无效且不应执行任何操作...

您需要在每个span元素上设置样式;

var ea = document.getElementsByClassName('name');
for(var i = 0; i < ea.length; i++)
        ea[i].style.backgroundColor = "yellow";

Answer 2

尝试使用jQuery， http://jsfiddle.net/sameerast/gT9eh/

Answer 3

如上所述 - 您的JS无效。对于初学者，函数名称是'getElementsByClassName'而不是'getElementByClaassName'。

然后，您需要循环遍历元素并单独设置其属性。 JQuery将为您提供Sameera概述的一个很好的快捷方式。