在DIV onClick中显示图像

<div id="myDiv" onClick="showImage()">点击我显示图像</div>

function showImage() {
   var image = document.createElement("img");  // 创建一个img元素
   image.src = "图片路径";  // 设置图片的路径
   document.body.appendChild(image);  // 将图片元素添加到body中显示
}

#myDiv {
   width: 200px;
   height: 200px;
   background-color: lightgray;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
}

<style>
#myDiv {
   width: 200px;
   height: 200px;
   background-image: url('初始图像路径');
   background-size: cover;
   transition: background-image 0.5s;
}

#myDiv:hover {
   background-image: url('悬停图像路径');
}
</style>

<div id="myDiv"></div>