Question

我是javascript的新手，我想在div标签中附加一个img标签。但它并没有与div中已存在的元素相结合。

这是我的HTML代码：

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

我的javascript代码：

    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;

如果您要附加元素的内容，请调用元素的insertAdjacentHTML方法：

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

图片没有附加在Javascript中

1 个答案: