为什么anime.js在我的浏览器中工作？

Question

出于某些原因，我的anime.js并不在我的浏览器中工作，但是当我将我的代码提供给在线认识的人时，它对他们来说效果很好。

这是我的HTML代码：

<div id="CSStransforms">
  <div class="square el"></div>
</div>

是的，我已将cdn链接到了＆gt;

<script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/2.2.0/anime.js"></script>
<script src="main.js"></script>

这是我的JAVASCRIPT代码：

var CSStransforms = anime({
  targets: '#CSStransforms .el',
  translateX: 250,
  scale: 2,
  rotate: '1turn'
});

这是我的所有代码：https://codepen.io/sadsada/pen/GxKePJ

Answer 1

您需要在main.js标记的 end 处加载body，以便在脚本执行时加载DOM。如果您将其放在head（body上方），则DOM尚未加载您的元素，因此anime.js找不到它们。

这就是codepen工作的原因，但是你自己的网站没有。在执行脚本之前，codepen会加载DOM。