画像がJavascriptで付加されていません

Question

javascriptが新しく、divタグ内にimgタグを追加しようとしています。 ですが、div内に既に存在する要素と連結していません。

これは私のHTMLコードです：

<div class="ce_label"> 
     <span>some text</span> 
     <span>some text</span> 
    </div> 

私のjavascriptのコード：

<div class="ce_label"> 
     <img src="smiley.gif" alt="Smiley face" height="42" width="42"> 

     <span>some text</span> 
     <span>some text</span> 
    </div> 

しかし、私はこの出力を得ることができませんでした..：

var sel = '.ce_label'; 
    var toolTemplate = [ 
    '<img src="smiley.gif" alt="Smiley face" height="42" width="42">' 
    ]; 
    window.onload = function() { 
    var x = document.querySelectorAll(sel); 
    var commentHtml = toolTemplate.join(''); 
    for (var i = 0; i < x.length; i++) { 
    x[i].appendChild = commentHtml; 
    } 

    }; 

だから私の出力があるべき

誰でも私はそれを修正するp ???

ありがとうございます。

Answer 1

あなたが上書きすることはできません機能を指し、要素のappendChildプロパティに文字列を代入しようとし

このライン

x[i].appendChild = commentHtml; 

が。

あなたはinnerHTMLに割り当て、そのHTMLを持つ要素の内容を置き換える場合：

x[i].innerHTML = commentHtml; 

あなたは要素の海流内容を追加したい場合は、要素のinsertAdjacentHTMLメソッドを呼び出す：

x[i].insertAdjacentHTML("beforeend", commentHtml);