带有可点击图像的JavaScript弹出窗口

Question

我有一个弹出窗口(在Javascript中(，我想在其中包含一个隐藏在图像中的按钮。

因此，如果用户单击图像，则应执行该操作。在HTML中这很容易，但我不知道如何在Javascript中做到这一点。 感谢您的任何帮助。

我所知道的是如何用文本做到这一点。我是这样做的：

document.write('<input type="button" value="F e r m e r" onClick='window.close()' class="button" onmouseover="this.className='buttonon'" onmouseout="this.className='button'" style="width: 100px;">'); 

Answer 1

您可以在CSS中设置background-image按钮，因为您可能无论如何都要设置它的样式。

document.write('<button type="button" class="image-button" onclick="myFunction()">')    
function myFunction() {
console.log("I love Malamuts");
}

.image-button {
background-image: url("https://www.psy.pl/wp-content/uploads/2017/03/shutterstock_375206839-864x575.jpg");
background-size: cover;
width: 50vw;
height: 100vh;
}