Блог

Итак, у меня есть простой javascript, который выглядит следующим образом

 function  myfunction(){

var a = [document.getElementById("div1"),
document.getElementById("div2"), document.getElementById("div3")];

if(a.style.display=="none"){

setTimeout(function(){a.style.display="block";},4000);
}

}
  

И html-код выглядит так

 <  a href="#" onclick="myfunction();"  >   click to show div1 and div2 after 4 seconds<   /a  >

<  p id="div1"   style="display:none;" >divv1<  /p  >


<  p id="div2"    style="display:none;"    >divv2<  /p  >



<  p id="div3"    style="display:none;"    >divv3<  /p  >
  

Однако divs не отображаются через 4 секунды после того, как я нажал.

Что-то не так с моим кодом?

Может кто-нибудь, пожалуйста, направить меня дальше?

Большое спасибо!

var a — это массив, поэтому вам нужно установить стиль для всех элементов массива.

 function myfunction() {

  var a = [document.getElementById("div1"),
    document.getElementById("div2"), document.getElementById("div3")
  ];

  if (a[0].style.display == "none" amp;amp; a[1].style.display == "none" amp;amp; a[2].style.display == "none") {

    setTimeout(function() {
      a.forEach(item => item.style.display = "block");
    }, 4000);
  }

}  

 <a href="#" onclick="myfunction();"> click to show div1 and div2 after 4 seconds
  </a>

<p id="div1" style="display:none;">divv1
</p>


<p id="div2" style="display:none;">divv2
</p>



<p id="div3" style="display:none;">divv3
</p>  

a — это массив. У него нет свойства style. Вам нужно выполнить итерацию по массиву и изменить свойство отображения для каждого.

 function  myfunction() {

  var a = document.querySelectorAll("p") ;

  a.forEach( div => {
    if(div.style.display == "none"){
      setTimeout(function() {
        div.style.display = "block";
      }, 4000);
    }
  });
}