Javascript 文字动画

Javascript 文字动画,javascript,animation,text,Javascript,Animation,Text,我是Javascript的新手,我想知道如何使用js编写这个示例;使用单词数组并选择每个单词之间高亮显示的速度 示例:欢迎启动Javascript 我将从以下教程开始: 它将引导您了解如何使用代码更改HTML元素 使用javascript轻松设置CSS属性后,您可以查看setTimout()或setInterval,在设定的时间表上设置动画并循环执行视觉更改。有很多方法可以实现这一点。 我会给你看最丑陋的方式 这是使用纯javascript和setInterval方法 var arrOfWo

我是Javascript的新手,我想知道如何使用js编写这个示例;使用单词数组并选择每个单词之间高亮显示的速度


示例:

欢迎启动Javascript

我将从以下教程开始:

它将引导您了解如何使用代码更改HTML元素


使用javascript轻松设置CSS属性后,您可以查看
setTimout()
setInterval
,在设定的时间表上设置动画并循环执行视觉更改。

有很多方法可以实现这一点。 我会给你看最丑陋的方式 这是使用纯javascript和setInterval方法

var arrOfWord=[“猫”、“狗”、“乐趣”、“坐”、“文”、“十”、“太阳”、“网”、“帽子”];
var arrOfDiv=[];
var con=document.getElementById(“容器”);
用于(arrOfWord中的变量i){
con.innerHTML+=“”+arrOfWord[i]+“”;
}
arrOfDiv=con.儿童;
window.setInterval(
(功能(){
var-next=0;
函数highlightWord(){
如果(下一步>区域长度-1){
next=0;
}
如果(下一个==0){
arrOfDiv[arrOfDiv.length-1].style=“border:2px solid#00000000”;
}
else arrOfDiv[next-1].style=“border:2px solid#00000000”;
arrOfDiv[next].style=“border:2px solid#ffff00”;
下一个+=1;
}
返回highlightWord;
})(),500
);
#字框{
显示:内联块;
填充物:5px;
保证金:2倍;
边界半径:5px;
边框:2倍实心#00000000;
}
#容器{
宽度:140px;
}


你能分享一些到目前为止你写的代码吗?嗨,正如我说的,我只是在学习js,我只知道基本知识,这就是为什么我想知道是否有人能帮助我使用画布指导我完成这项工作?有很多动画库可以实现这一点…谢谢,这对制作有很大帮助,现在我可以理解如何做到这一点,因为我在考虑在画布上制作,但这将是一个很好的图像,对吗?