我无法通过 js 出现弹出窗口答案

【问题标题】：I am unable to make a popup appear through js我无法通过 js 出现弹出窗口
【发布时间】：2021-12-17 00:22:59
【问题描述】：

我正在尝试添加一个弹出窗口，点击专辑封面后会出现心形图像。我之前使用过这段代码来创建模态框，但是，由于某种原因，它不适用于这个。

<div class="main">


    <btn class="btn" id="btn"></btn>
    <div class="like" id="liker">
        <img src="heart.svg" alt="Flowers in Chania">
    </div>
    <div class="info" id="info">
        <div class="albumArt" id="album"></div>
        <div class="song">Song</div>
        <div class="artist">Artist</div>
    </div>`
    <script>
// Get the button that opens the modal
var album = document.getElementById('album');

// Call the buttons into the function

var heart = document.getElementById('liker');


album.onclick = function () {
    heart.style.display = "block";

}

</script>

【问题讨论】：

您的js 不在<script/> 标签中，是不是打错字了？
哦不，这不是错字，我为 javascript 使用了一个单独的文件，而不是将其全部保存在 html 中
我认为你应该在相册中有一个值，以便它出现在 DOM 中

标签： javascript modal-dialog popup

【解决方案1】：

这对我有用。请参阅我为“专辑”元素添加了文本

<div class="main">

    <btn class="btn" id="btn"></btn>
    <div class="like" id="liker">
        <img src="http://icons.iconarchive.com/icons/paomedia/small-n-flat/72/heart-icon.png" alt="Flowers in Chania">
    </div>
    <div class="info" id="info">
        <div class="albumArt" id="album">Album</div>
        <div class="song">Song</div>
        <div class="artist">Artist</div>
    </div>

    <script>
      // Get the button that opens the modal
      var album = document.getElementById('album');

      // Call the buttons into the function

      let heart = document.getElementById('liker');

      album.onclick = function () {
          heart.style.display = "block";
          setTimeout(() => heart.remove(), 1000);
      }
    </script>
</div>

【讨论】：