javascript - 延迟隐藏元素

Question

在这种情况下，元素隐藏在一个位置。不明白为什么它一开始不显示“P”标签然后慢慢隐藏它。请帮我解决一个问题。

var step = 0.1;
var delay = 90000;
var displayMe = function() {
  if (element.style.opacity < 1) {
    element.style.opacity += step;
    setTimeout('displayMe()', delay);
  }
}

var hideMe = function() {
  var elem = document.getElementById('regform');
  if (elem.style.opacity >= 0) {
    elem.style.opacity -= step;
    setTimeout('hideMe ()', delay);
  }
}

hideMe();

<p id="regform">aaaaaaaaaaaaaaaaa</p>

Answer 1

Element.style.prop将只读取内联样式。定义 style='opacity:1'对于 <p>元素。

var step = 0.1;
var delay = 1000;

var displayMe = function() {
  if (element.style.opacity < 1) {
    element.style.opacity += step;
    setTimeout(displayMe, delay);
  }
}

var hideMe = function() {
  var elem = document.getElementById('regform');
  if (elem.style.opacity >= 0) {
    elem.style.opacity -= step;
    setTimeout(hideMe, delay);
  }
}

hideMe();

<p id="regform" style='opacity:1'>aaaaaaaaaaaaaaaaa</p>