이미지가 자바 스크립트에 추가되지 않습니다.

Question

javascript에 익숙하지 않아 div 태그 안에 img 태그를 추가하려고합니다. 하지만 div에 이미 존재하는 요소와 연결되어 있지 않습니다.

이 내 HTML 코드입니다 :

<div class="ce_label"> 
     <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; 
    } 

    }; 

그래서 내 출력해야한다 :

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

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

하지만이 출력을 얻을 수 없었다 ..

누구나 할 수 있습니다. 나 그것을 고칠 나 ???

미리 감사드립니다.

Answer 1

이 줄

x[i].appendChild = commentHtml; 

시도는 덮어 쓸 수 없습니다 함수를 참조하는 요소의 appendChild 속성에 문자열을 할당합니다. 당신이 HTML를 가진 요소의 내용을 바꾸려면

, innerHTML에 할당 :

x[i].innerHTML = commentHtml; 

당신이 요소의 curent 내용에 추가하려면, 호출 요소의 insertAdjacentHTML 방법 :

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