jQuery Animate函数遍历数组时在索引1处停止，求故障原因

你的动画在索引1处停止的核心原因是HTML中引入jQuery的script标签存在语法错误，导致jQuery库未被正确加载。当jQuery无法正常工作时，fadeOut和fadeIn这些动画方法在第二次执行时会触发错误，直接终止后续的动画循环。

具体错误点 #

原HTML中的script标签写法存在两处问题：

<script src="https://code.jquery.com/jquery-3.7.0.min.js""</script>

• src属性结尾多了一个额外的双引号
• 标签闭合部分写法错误，应为</script>而非""</script>

修复步骤 #

1. 修正script标签语法，正确引入jQuery：

<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>

2. 你的JavaScript逻辑本身没有问题，修复后的完整代码如下：

HTML代码

<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<span id="services"></span>

JavaScript代码

var array = ["Marketing", "Web Design", "Hosting", "Search Engine Optimization", "Business"];
var index = 0;
$("#services").text(array[0]);

(function animate() {
  $("#services").fadeOut(1000, function() {
    index = (index + 1) % array.length;
    this.textContent = array[index];
  }).fadeIn(1000, animate);
})();

修复后，jQuery可正常加载，动画会循环遍历数组内所有元素，不会再中途停止。

内容的提问来源于stack exchange，提问作者Andrew Buccellato