不能使用jQuery动画方法在DIV内部动画字母（用span标签包装）

Question

var letter = $("div#text").children().first();
letter.animate({
    opacity:"0.5"
},3000) // works!


var allLetters = $("span");
allLetters[1].animate({
    opacity:"0.5"
},3000) // it doesnt works

这是我的小提琴：https://jsfiddle.net/n40af9dh/

当我在通过jQuery遍历DOM方法对span对象进行推断的字母变量上调用动画方法时：$（＆＃34; div＃text＆＃34;）。children（）。first（）它的工作原理。但是，当我在：

上调用相同的方法时

var allLetters = $("span");
allLetters[1].animate({
    opacity:"0.5"
},3000) 

它不起作用，控制台输出以下错误：

  

无法执行＆＃39;动画＆＃39; on＆＃39;元素＆＃39 ;:部分关键帧不是   支撑。

Answer 1

问题是因为通过索引访问jQuery对象（与[1]一样）会返回一个没有animate()方法的DOMElement，因此会出错。

要执行您的要求，您应该使用eq()代替：

$("span").eq(1).animate({
    opacity: 0.5
}, 3000);

Updated fiddle

请注意，索引1处的项目是第二个span，因为索引基于零。如果您想要第一个范围，请使用eq(0)。