如何使用JavaScript在屏幕上填充文本？

Question

我的目标是只使用JS创建Matrix Rain效果。我尝试删除填充，边距。然后将window.innerWidth除以字体大小16px。我不知道打印文本的任何有效方法，所以我只使用for循环for(i = 0; i <= sum; i++)，但它只填充不到一半的屏幕。我还使用了Consolas字体，因此每个字符的宽度应为16px。

Answer 1

好吧，这不是我想要的，但我想到了一个便宜的方式。我将只使用for循环来打印宽度和高度为<div>的{​​{1}}。这样我就可以在其中放置一个字符并使其居中。

Answer 2

除非您特别需要它在DOM中，您是否考虑过在Cavnas中这样做？它比使用包含大量字符的div运行得更顺畅。

以下是我如何获得窗口尺寸。

var height = window.innerHeight;
var width = window.innerWidth;

window.addEventListener('resize', function(event){
  var height = window.innerHeight;
  var width = window.innerWidth;
});

这是我为你准备的一个快速的傻瓜： https://plnkr.co/edit/hpJVAK5F3OjMihFq3nps?p=preview

请注意CSS中的规则。