動態更改html元素

我有一些複選框，一旦我檢查其中一個複選框的ID是發送到一個函數。我希望使用此功能將複選框更改爲具有相同ID的<img>元素。動態更改html元素

我已經試過

document.getElementById(ID).innerHTML = '<img src="image.png" id="' + ID + '"/>';

但是，這並不工作，是有可能改變一個元素或者我需要使用同一個ID一個新的？

感謝

來源

2010-12-07 Elliott

請注意，如果您從文檔*中刪除一個元素並創建另一個元素，並使用相同的`id` *，則可能會發現您很快就會發現CSS問題。 – 2010-12-07 00:42:00

在這種情況下，我沒有任何與我正在使用的ID相關的CSS。 – Elliott 2010-12-07 00:50:21

我會建議，而不是另一個你做出一個可見和不可見的一個替代例如一個元素...

document.getElementById(ID).style.display='none';

和

document.getElementById(ID).style.display='block';

而且我認爲圍繞相同的ID約束。爲什麼你需要他們有完全相同的ID？

function changeToImage(el) { 
    var img = document.createElement('img'); 
    img.setAttribute('src', 'http://www.google.com/images/nav_logo29.png'); 
    img.setAttribute('ID', el.getAttribute('id')); 
    var parent = el.parentNode; 
    parent.appendChild(img); 
    parent.removeChild(el); 
}

然後從你的HTML你會做

<input type="checkbox" onclick="changeToImage(this)" />

注意，這未必是跨瀏覽器的證明....你可以：

來源

2010-12-07 00:34:58

在純JavaScript，你可以這樣做

也使用jQuery來簡化事情

來源

2010-12-07 00:38:46 Jaime

你需要創建一個新的元素，並刪除舊的。如果你需要它，下面是關於使用javascript添加和刪除元素的快速文章：http://www.dustindiaz.com/add-and-remove-html-elements-dynamically-with-javascript/

通過解釋爲什麼你不能做你想做的事情，你的元素在DOM中被表示爲不同的「類型「（嚴格來說，這不是真的，但它是一種有用的表示），並且不能通過更改其基礎標記來更改對象的」類型「。

來源

2010-12-07 00:39:50 Ender

你可以嘗試寫這樣one.It工作了me.Reaplace的innerHTML與HTML

的document.getElementById（ID）.HTML = '';

來源

2013-04-22 09:38:32 Daenarys

動態更改html元素

回答

相關問題