如何在HTML中自动重复背景文本

Question

我从另一个问题中获取了以下代码，但它对我不起作用....有人可以说为什么？如何使这部分工作？

Array.from(document.querySelectorAll('.watermarked')).forEach(function(el) {
      el.dataset.watermark = (el.dataset.watermark + ' ').repeat(300);
    });

我把它放在脚本标签

中

Array.from(document.querySelectorAll('.watermarked')).forEach(function(el) {
  el.dataset.watermark = (el.dataset.watermark + ' ').repeat(300);
});


.watermarked {
  position: relative;
  overflow: hidden;
}

.watermarked img {
  width: 100%;
}

.watermarked::before {
  position: absolute;
  top: -75%;
  left: -75%;

  display: block;
  width: 150%;
  height: 150%;

  transform: rotate(-45deg);
  content: attr(data-watermark);

  opacity: 0.7;
  line-height: 3em;
  letter-spacing: 2px;
  color: #fff;
}
<div class="watermarked" data-watermark="howbloggerz">
  <img src="http://www.w3schools.com/css/img_fjords.jpg">
</div>