Javascript İf Promise 加载 Onclick 然后 İf 再次 Onclick 不再加载？

Question

var sarki = document.getElementsByClassName("sarki")[0];
var modal = document.getElementById("myModal");
var span = document.getElementsByClassName("close")[0];

sarki.onclick = function () {
  document.getElementsByClassName("siyah")[0].innerHTML = "<div class='loader'></div>";
Promise.all([
  fetch('blabla.txt').then(x => x.text())
]).then(([sarki]) => {
  document.getElementsByClassName("siyah")[0].innerHTML = sarki;
}),modal.style.display = "block",document.title="blabla";
}

span.onclick = function() {
  modal.style.display = "none",document.title="blabla";
}

window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none",document.title="blabla";
  }
}

如您所见，单击按钮是否会获得 txt 文件，但再次如您所见，我打开了模式，您可以关闭该模式，但如果您再次单击该按钮（不刷新页面），该 txt 文件将再次加载。 .我只是想检查是否加载了txt文件然后不再加载因为我制作了歌曲列表但是如果再次加载播放歌曲正在停止...

如果加载的文件不使用 javascript（没有库）再次加载，我该怎么办？

Answer 1

您需要跟踪文本文件是否已经加载。您也不需要Promise().all()，因为您处理的是单个因素（文件），而不是多个因素。

let file; //<-- file loaded tracker
sarki.onclick = function () {
    let prom = new Promise(res => {
        !file ?
            fetch('blabla.txt').then(x => res(file = x.text())) :
            res(file);
    });
    prom.then(file => {
        document.getElementsByClassName("siyah")[0].innerHTML = file;
    });
}