document.getElementById（“”）.src不工作？

我希望能够在下拉列表中选择电池9。
我想让电池9的图像显示在img标签中。
我做错了什么？document.getElementById（“”）.src不工作？

HEAD 
function checkBatteryLife(){ 
if(document.getElementById('batterylifes').value == 'batterylife9'){ 
    document.getElementsByTagName('batteryID').src = 'battery9.png'; 
} 
BODY 
<img alt="" src="" name="batteryID" onclick="checkBatteryLife()"> 
</br> 
<select id="batterylifes" onchange="checkBatteryLife()"> 
<option name="batteryIMG" value="batterylife9">Battery 9</option> 
</select>

来源

2012-07-12 FishBowlGuy

'batteryID'不是'document.getElementsByTagName（）'的有效参数。我会给你的图像标签一个ID，并使用'document.getElementById（）'代替它。另外，无关：'
'不是有效的标记。使用'
'或'
'。 – 2012-07-12 17:56:41

我不知道为什么，但使用
给了我这个错误“这个元素不允许在模式中自行关闭。删除结束斜杠” – FishBowlGuy 2012-07-12 18:02:29

然后只需使用'
'。这个自闭例子是针对XHTML文档的。 – 2012-07-12 18:06:34

getElementsByTagName方法将按名称返回一组标签，如IMG或SELECT。传递标记的name属性不会产生任何结果。

你应该使用getElementById并传入元素的id：

function checkBatteryLife() { 
    if(document.getElementById('batterylifes').value == 'batterylife9') 
    { 
     document.getElementsById('batteryID').src = 'battery9.png'; 
    } 
}

<img alt="" src="" id="batteryID" onclick="checkBatteryLife()" /> 
<br /> 
<select id="batterylifes" onchange="checkBatteryLife()"> 
    <option name="batteryIMG" value="batterylife9">Battery 9</option> 
</select>

您还可以使用getElementsByName将返回DOM元素的集合与指定name属性，然后遍历它以找到正确的属性。

来源

2012-07-12 17:57:07

你需要.getElementsByName()功能，而不是.getElementByTagName()：

document.getElementsByName('batteryID')[0].src = 'battery9.png';

由于.getElementsByName()函数返回列表，而不是一个单一的元素，用于访问列表的元素，你需要使用[]方brackets.Specifically你需要先与name="batteryID"匹配的元素，这就是为什么你应该使用[0]。

来源

2012-07-12 17:56:06 Engineer

首先，通过简单读取select的值，获得所选option的值并不是跨浏览器兼容的。相反，首先检测所选的option，然后读取ITS值。

var sel = document.getElementById('batterylifes'); 
if (sel.options[sel.options.selectedIndex].value == 'batterylife9') { 
    //your code here... 
}

其次，正如许多人所指出的那样，你被错误使用getElementsByTagName通过其名称引用一个元素。你需要getElementsByName()，虽然这不是跨浏览器兼容。其他选项：

使用jQuery或其他一些图书馆
，如果你不关心旧的浏览器，使用新的方法document.querySelector()通过CSS语法
选择元素赋予图像的ID及使用getElementById()

来源

2012-07-12 18:03:29 Utkanos

绝对值得一试。 – 2012-07-12 18:09:30

Ta非常:) ... – Utkanos 2012-07-12 18:11:41

document.getElementById（“”）.src不工作？

回答

相关问题