对javascript间隔使用淡入淡出效果

我有一个javascript函数，可以每隔几秒钟更改一个单词。 代码如下：

<div id="changeText" >Hello</div>

 <script type="text/javascript">
var text = ["Welcome", "Hi", "Sup dude"];
var counter = 0;
var elem = document.getElementById("changeText");
setInterval(change, 5000);
function change() {
 elem.innerHTML = text[counter];
    counter++;
    if(counter >= text.length) { counter = 0; }
}
</script>

你好 var text=[“欢迎”、“嗨”、“超级帅哥”]； var计数器=0； var elem=document.getElementById（“changeText”）； 设置间隔（更改，5000）； 函数更改（）{ elem.innerHTML=文本[计数器]； 计数器++； 如果（计数器>=text.length）{counter=0；} }

---

这很好，但我想知道是否有办法使文本淡入/淡出，这样看起来更好？

既然您将问题标记为jQuery，我认为jQuery是可以接受的

在这种情况下，更改：

elem.innerHTML = text[counter];

到

---

.

我会这样做：淡出文本，更改它，然后淡入

var text = ["Welcome", "Hi", "Sup dude"];
var counter = 0;
var elem = document.getElementById("changeText");

setInterval(change, 1500);

function change() {
  $(elem).fadeOut('fast', function() {
    $(elem).text(text[counter++]);

    if (counter >= text.length) {
      counter = 0;
    }

    $(elem).fadeIn('fast');
  });
}

---

看看Jquerys.fadeIn（时间）我认为你应该使用JQuery…我个人更喜欢淡出文本，然后更改，然后淡入：

var text = ["Welcome", "Hi", "Sup dude"];
var counter = 0;
var elem = document.getElementById("changeText");

setInterval(change, 1500);

function change() {
  $(elem).fadeOut('fast', function() {
    $(elem).text(text[counter++]);

    if (counter >= text.length) {
      counter = 0;
    }

    $(elem).fadeIn('fast');
  });
}