创建一个新DIV元素，其中包含图像

问题描述

当我单击时，我想创建一个新的DIV，其中包含一个图像。

这是我尝试的代码：

let addTask = document.querySelector('#addTask');
addTask.addEventListener('click',()=>{

         //create DIV,This part of the code works well
    
      let createNewDiv = document.createElement('div');
        createNewDiv.innerHTML = writeTask.value;
        document.body.appendChild(createNewDiv);
        createNewDiv.className = 'tasks';   


     
          //create an image inside the DIV element,This part of the code does not work

      let imageDelete = document.createElement('img');
          imageDelete.src = 'deleteImage.jpg';
          document.body.tasks.appendChild(imageDelete);
});

我的错误在哪里？

任何评论或反馈都可以帮助我。谢谢

解决方法

createNewDiv.appendChild(imageDelete)

似乎您正在使用类.tasks创建一个元素。然后，您尝试使用document.body.tasks访问它。

使用此方法无法直接访问具有类的元素。但是，具有ID的元素可以。

因此，您需要更改.tasks元素以包括ID tasks或将访问器重写为document.querySelector('.tasks')

document.querySelector('.tasks').appendChild(imageDelete);

appendchild dom javascript