Javascript |未捕获的类型错误 : Cannot set property 'color' of undefined

Question

我有一个 div，当鼠标悬停在开/关时，它会改变其中元素的 css。但是当我鼠标悬停和鼠标移出时出现错误，并且颜色没有改变(错误在这个问题的标题中)

有趣的是前两个更改有效(更改图像和更改 ID“ace_title”的颜色，但“ace_feature”的鼠标悬停和鼠标移开会产生错误。

下面是我的代码和我尝试过的:

<div class="service_level effect8" onmouseover="getElementById('ace_service').src='images/ace_hover.png';
    getElementById('ace_title').style.color='#2C81B7';
    getElementsByClassName('ace_features').style.color='#2C81B7';"
    onmouseout="getElementById('ace_service').src='images/ace.png';
    getElementById('ace_title').style.color='black';
    getElementsByClassName('ace_features').style.color='black';">

    <img src="images/ace.png" id="ace_service">
    <p id="ace_title">Ace Service</p>

    <img src="images/icon_tick.png" style="float: left; padding: 3px 4px 0px 15px;">
    <p class="ace_features">
        Outstanding IT Support
    </p>

    <img src="images/icon_tick.png" style="float: left; padding: 3px 4px 0px 15px;">
    <p class="ace_features">
        Outstanding IT Support
    </p>

Answer 1

当您使用 getElementById 时，您会收到一个元素，因此它可以正常工作。当您使用 getElementsByClassName 时，您会收到一个元素集合(在您的案例中包含两个元素)，因此它不起作用。

下面一行应该可以工作:

getElementsByClassName('ace_features')[0].style.color='black'

但是使用普通脚本 block 而不是内联会好得多