避免额外使用跨度

Question

我的问题是我有一个HTML代码 <p> Hello World </p>

并希望使用JavaScript更改每个字母的CSS.基本上,我会改变背景颜色来制作动画.有没有办法做到这一点,而不是在每个字母周围做一个跨度或某种标记,并经历所有的斗争？

我有颜色的字符串数组和调用正确颜色的方法(数据索引属性).

谢谢!

编辑:我通过创建一个迭代innerHTML字符串索引的函数并通过编辑Cymen下面提供的函数为字母的跨度指定数据索引来改变颜色并思考一个想法.这是一个好方法吗？

Answer 1

不,您需要使用支持的标签background-color.您可以轻松地将字符串包装成跨度,如下所示:

function wrapInSpans(string) {
  return '<span>' + string.split('').join('</span><span>') + '</span>';
}