動的にhtml要素を変更する

私はいくつかのチェックボックスを持っています。これらのチェックボックスの1つをチェックすると、そのチェックボックスのIDが関数に送られます。この機能をチェックボックスを同じIDの<img>要素に変更したいとします。動的にhtml要素を変更する

私は

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

を試してみました。しかし、これは動作しません、それは要素を変更することが可能であるか、私は同じIDを使用して新しいものを作成する必要があるでしょうか？

おかげ

私はそれを助言するのではなく、あなたが目に見えるものを作る別および例えば目に見えないものと一つの要素に代わる

出典

2010-12-07 Elliott

文書の*から同じ要素を削除して、その中に別の要素を作成すると、すぐにCSSの問題が発生することがあります。 –

この場合、使用しているIDに関連するCSSはありません。 – Elliott

プロジェクトでjQueryを使用できない理由を聞くことができますか？ –

...

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

と

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

そして、私が思うだろう同じID制約の途中でなぜあなたはそれらがまったく同じIDを持つ必要がありますか？あなたは、これはクロスブラウザの証拠....あなたがすることができないかもしれないこと

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

ノートを行うだろう、あなたのhtmlから、その後

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); 
}

：あなたのような何かを行うことができますjavascriptを純粋で

出典

2010-12-07 00:34:58

ありがとう、私は通常これを行うだろうが、最初の要素はもはや必要ではないので、すべて一緒に取り除く方が良いと思った？ – Elliott

これを削除して、 'img'を表示させることができます。 jQueryの使用を検討しましたか？ –

どうすれば削除できますか？私のプロジェクトではjQueryは許可されていません:( – Elliott

jqueryを使って物事を単純化する

出典

2010-12-07 00:38:46 Jaime

新しい要素を作成して古い要素を削除する必要があります。必要な場合は、javascriptを使用して要素を追加したり削除したりする簡単な記事があります。http://www.dustindiaz.com/add-and-remove-html-elements-dynamically-with-javascript/

あなたがしようとしていたことができない理由を説明するために、（厳密に言えば、これは当てはまりませんが、それは有用な表現です）、基本的なマークアップを変更することによってオブジェクトの "タイプ"を変更することはできません。

出典

2010-12-07 00:39:50 Ender

あなたはこのone.Itのように書いてみることができますが、HTMLとinnerHTMLのme.Reaplaceのために働い

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

出典

2013-04-22 09:38:32 Daenarys

動的にhtml要素を変更する

答えて

関連する問題