使用innerHTML改变p元素的内容

时间:2011-08-17 05:38:15

标签: javascript

我有以下脚本:

var before = document.getElementById('before');    
if (switchElement.value == 'single'){
    for (var i=0; i < before.length; i++) {
        if (before[i].id == "before_label") {
            before[i].innerHTML = 'Image';
            break;
        }
    }
    after.style.display = 'none';   
} 

,HTML看起来像:

<div id="before">
    <p id="before_label"> Before Image: </p>
    <input type="file" name="before"  size="40">
    <input type="hidden" name="MAX_FILE_SIZE" value="10000000">
</div>

想知道为什么它不起作用并改变内部html改变?

3 个答案:

答案 0 :(得分:6)

要访问innerHTML的{​​{1}},只需直接访问它:

before_label

答案 1 :(得分:0)

getElementById只返回一个元素。您需要通过childNodes访问子对象。

试试这个:

var before = document.getElementById('before').childNodes;    
if (switchElement.value == 'single'){
    for (var i=0; i < before.length; i++) {
        if (before[i].id == "before_label") {
            before[i].innerHTML = 'Image';
            break;
        }
    }
    after.style.display = 'none';   
} 

答案 2 :(得分:0)

为什么for循环?只需通过其id获取元素:

var before_label = document.getElementById('before_label');
if (switchElement.value == 'single') {
    before_label.innerHTML = 'Image';
    after.style.display = 'none';
}