为什么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

你需要在标签main.js的末尾加载你的body，所以在你的脚本执行时 DOM 已经加载了。如果你把它放在head（在 之上body），DOM 还没有加载你的元素，所以anime.js没有找到它们。

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