如何在不单击 HTML 或 JS 中的任何内容的情况下显示文本？

Question

我不需要帮助就可以在 HTML 的页面上获取文本，我知道该怎么做。 你知道在 MS-DOS 中加载文本时的样子：

正在启动 MS-DOS... 模式 select 代码页 function 完成。

我曾考虑过调用 StartTimer 并使其立即改变 div 的不透明度，但我不确定这是否可行，我一直试图在网上找到与我的问题类似的任何东西，但没有任何东西。 谢谢你的帮助。

Answer 1

你的标题表明你不想“点击任何东西...... [in] JS”，所以我认为这意味着你仍然可以完全使用 JavaScript ，因为你提到在你的问题正文中调用 function 。 大概您只是希望它在页面加载时立即工作，而不是有人“点击某物”。

如果您只是想让它在一段时间后出现，请使用：

您的 HTML 标记：

<div id="myDiv" style="opacity:0">Starting MS-DOS</div>

还有你的 JS：

setTimeout(function() {
  document.querySelector("myDiv").style.opacity = 1;}
, 3000);

这将在 3 秒后立即将文本显示到页面上。 您还可以使用以下方法将其淡入屏幕：

setTimeout(function() {
  var interval = setInterval(function() {
    document.querySelector("div#myDiv").style.opacity += 0.1;
    if (document.querySelector("div#myDiv").style.opacity >= 1) {
      clearInterval(interval);
    }
  }, 250);
}, 1000);

这种方法将等待 1 秒，然后通过 setInterval 在 2.5 秒内淡入文本，然后在达到不透明度 1 时清除该间隔。

Answer 2

这个怎么样，我只用 css 创建了这个

 body { background: black; color: white; } @keyframes anim { from { opacity: 0; } to { opacity: 1; } }.start { opacity: 0; animation: anim 1.5s; }.end { position: absolute; top: 0; opacity: 0; animation: anim 1s 1.5s forwards; }

 <h2 class="start">Starting MS-DOS...</h2> <h2 class="end">C:\></h2>