为什么只显示 arr[0]

Question

为什么只显示数组的第一个元素？

代码：

<html>
<head>
   <meta charset="utf-8">
   <style>
       #news {
    height: 30px;
    background-color:rgba(0, 0, 255, 0.37);
    direction: rtl;
    line-height: 30px;

}
    </style>
     <p id="x"></p>
     <p id="y"></p>
     <p id="z"></p>
     <p id="w"></p>
</head>
    <body>
        <div id="news">اخبار :<span id ="ne"></span></div>
        <script>
            var spn = document.getElementById("ne");
            var str = "";
            var arr = ["بهترین ها در سایت ما","آموزش جاوا اسکریپت","مرجع کامل سی اس اس","اولین دوره شبکه"];
            var len = arr.length;
            var i =0,j=0,tim;
            lop();
            function lop() {
                if(arr[i]){
                     var myss = arr[i].split(""); 
                     tim = setInterval(function(){shw(myss)},100);
                }
            }
            function shw(st) {
                if(st[j] != undefined) {
                    str += st[j];
                    spn.innerHTML = str;
                    j+=1;
                }
                else {
                    clearInterval(tim);
                    i++;
                    lop();
                }        
            }
        </script>
    </body>
</html>

Answer 1

您似乎没有将 j 重置回 0

<html>
  <head>
    <meta charset="utf-8">
    <style>
      #news {
        height: 30px;
        background-color:rgba(0, 0, 255, 0.37);
        direction: rtl;
        line-height: 30px;

      }
    </style>
    <p id="x"></p>
    <p id="y"></p>
    <p id="z"></p>
    <p id="w"></p>
  </head>
  <body>
    <div id="news">اخبار :<span id ="ne"></span></div>
    <script>
      var spn = document.getElementById("ne");
      var str = "";
      var arr = ["بهترین ها در سایت ما","آموزش جاوا اسکریپت","مرجع کامل سی اس اس","اولین دوره شبکه"];
      var len = arr.length;
      var i =0,j=0,tim;
      lop(i);
      function lop(index) {
        if(arr[index]){
          var myss = arr[index].split(""); 
          tim = setInterval(function(){shw(myss)},100);
        }
      }
      function shw(st) {
        if(st[j] != undefined) {
          str += st[j];
          spn.innerHTML = str;
          j+=1;
        }
        else {
          clearInterval(tim);
          i++;
          j=0;
          lop(i);
        }        
      }
    </script>
  </body>
</html>

这是plunkr

Answer 2

我想出了解决办法：

var spn;
var str = "";
var arr = ["بهترین ها در سایت ما","آموزش جاوا اسکریپت","مرجع کامل سی اس اس","اولین دوره شبکه"];
var len = arr.length;
var i =0,tim;

window.onload = function() {
  spn = document.getElementById("ne");
  lop();
}

function lop() {
  arr = arr.join(' ').split("");
  if(arr.length > 0){
    tim = setInterval(function(){shw(arr)},100);
  }
}

function shw(st) {
  if(st[i] != undefined) {
    str += st[i];
    spn.innerHTML = str;
    i += 1;
  }
  else {
    clearInterval(tim);
  }
}

#news {
  height: 30px;
  background-color:rgba(0, 0, 255, 0.37);
  direction: rtl;
  line-height: 30px;

}

<div id="news">اخبار :<span id ="ne"></span></div>

为什么只显示 arr[0]

why show arr[0] only

javascript

setinterval