Javascript | Uncaught TypeError：無法設置未定義的屬性「顏色」

我有一個div，它在開啓/關閉時會改變其內部元素的CSS。但是我得到一個錯誤，當我mouseover和鼠標，並沒有改變顏色（錯誤是在這個問題的標題）Javascript | Uncaught TypeError：無法設置未定義的屬性「顏色」

有趣的是前兩個變化工作（改變圖像和改變顏色的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>

來源

2015-05-14 Eclipse

'「的document.getElementById（ 'ace_service'）。src' –

''getElementById''和'' getElementsByClassName'都是''document''的函數。 –

爲什麼不嘗試在var中放入javascript變量，然後應用.color –

這條線：

document.getElementsByClassName('ace_features')

返回數組元素或undefined

你應該改變你的mouseover事件ra療法外部函數，所以你可以遍歷所有的類名這樣

function onMouseOver() { 
 
    document.getElementById('ace_service').src = 'images/ace_hover.png'; 
 
    document.getElementById('ace_title').style.color = '#2C81B7'; 
 
    var elements = document.getElementsByClassName('ace_features'), i, len; 
 
    
 
    for (i = 0, len = elements.length; i < len; i++) { 
 
    elements[i].style.color = '#2C81B7'; 
 
    } 
 
} 
 

 
function onMouseOut() { 
 
    document.getElementById('ace_service').src = 'images/ace.png'; 
 
    document.getElementById('ace_title').style.color = 'black'; 
 
    var elements = document.getElementsByClassName('ace_features'), i, len; 
 
    
 
    for (i = 0, len = elements.length; i < len; i++) { 
 
    elements[i].style.color = 'black'; 
 
    } 
 
}

<div class="service_level effect8" onmouseover="onMouseOver()" onmouseout="onMouseOut()"> 
 

 
    <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> 
 
</div>

來源

2015-05-14 08:17:16 Icepickle

謝謝，這工作！ – Eclipse

當您使用getElementById您收到一個元素，所以它的工作原理。當您使用getElementsByClassName時，您會收到一個collecti元素（包含您的案例中的兩個元素），所以它不起作用。

以下行應當工作：

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

，但它會更好，而不是使用內聯正常腳本塊

來源

2015-05-14 08:16:47

所以，雖然你提到它會返回2個項目，你說只有設置單個元素應該工作？ – Icepickle

我只是說，如果有人想要將屬性設置爲集合中的所有元素，則無法執行此操作，而不是將此屬性設置爲集合中的每個元素。 –

Javascript | Uncaught TypeError：無法設置未定義的屬性「顏色」

回答

相關問題