爲什麼標籤的顏色不變？

在頁面加載標籤（即「輸入您的姓名」）的顏色後應該變爲紅色。但標籤的顏色保持不變。爲什麼這樣？爲什麼標籤的顏色不變？

SCRIPT

window.onload = startScript; 

function startScript() { 
if(document.getElementById("text_field").value === "me") { 
    var allTags = document.getElementsByTagName("label"); 
    allTags.className = "inserter"; 
} 
}

HTML

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<script type="text/javascript" src="inserter.js"> 
</script> 
<style type="text/css"> 
@import url("inserter.css"); 
</style> 
</head> 

<body bgcolor="#99FFFF"> 
<form> 
<label>Enter your name<input type="text" id="text_field" value="me" /> 
</label> 
</form> 
</body> 
</html>

CSS

@charset "utf-8"; 
/* CSS Document */ 

.inserter { 
color:#F00; 
}

現在，因爲該值等於me將類名稱「插入器」動態插入標籤元素，顏色應該顯示爲紅色。

爲什麼不會發生這種情況？

來源

2011-09-20 program-o-steve

我想你通過allTags需要循環：

var allTags = document.getElementsByTagName("label"); 
for (var i = 0; i < allTags.length; i++) { 
    allTags[i].className = 'inserter'; 
}

如果可以，雖然使用jQuery，它使生活變得更輕鬆！

UPDATE添加代碼的jQuery的等價：

if ($('#text_field').val() === 'me') { 
    $('label').addClass('inserter'); 
}

這只是這麼多的整潔

來源

2011-09-20 12:54:53 Clive

是的！但目前我是JavaScript的初學者。我認爲首先學習JavaScript會是一個好處，然後再轉到'jQuery'上？ –

當然。最終你會發現像我這樣的地方，你幾乎忘記了真正的JavaScript看起來像什麼。這些天'javascript == jQuery'對我來說！ – Clive

通過jQuery的嘗試。

allTags.addClass("inserter");

來源

2011-09-20 12:55:27

的getElementsByTagName方法返回包含每個匹配的標籤的DOM元素的數組。調用allTags.className = 'inserter'將值賦給數組本身的'className'屬性，而不是賦給該數組中的每個元素。您需要遍歷它，並將className分配給每個標籤。

來源

2011-09-20 12:56:26

正如其他人已經提到的getElementsByTagName（）返回一個元素的數組，而且你應該加上括號到您撥打startScript（），以確定其作爲函數的第一行。

這個例子有效; http://jsfiddle.net/aQASU/

來源

2011-09-20 13:08:10 Stefan

爲什麼標籤的顏色不變？

回答

相關問題