为什么anime.js 不能在我的浏览器中运行？

Question

由于某种原因，我的anime.js 无法在我的浏览器中运行，但是当我将我的代码提供给我在网上认识的人时，它对他们来说效果很好。

这是我的 HTML 代码：

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

是的，我已经链接了cdn ->

<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

您需要在body 标记的end 处加载您的main.js，因此在您的脚本执行时DOM 已经加载。如果你把它放在head（body上方），DOM还没有加载你的元素，所以anime.js找不到它们。

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