wkwebviewの中でfor文が動かなかった – Javascript

説明と結論

wkwebviewの中でjsが動かなくなりまして、その原因は、jsで書かれたループの場所で起こっていることが判明しました。配列の数だけループする処理をjsで書いてたんです。ブラウザではちゃんと実行されるんですが、何故かwkwebviewの中では動かなかったんです。

詳しく説明すると、for文でループをするたびに、document.createElementでimg要素を作って画面に描画するというものでした。ブラウザではちゃんとループした数だけimg要素が画面に出力されたのに、wkwebviewはだめ。最初は、domが完成した後にjsを実行すればいいかな？とか思ったんですが、だめでした。

答えは、ループの中にありました。ループするごとにimg要素を作って画面に描画されるわけですが、そのスピードについて来れなかったんですね。wkwebview。ブラウザは優秀ですが、wkwebviewは優秀ではないですね。

下記のようにして、一回ループするごとに、一旦ループ処理を止め、数秒後、またループのn回目を実行するようにすればいけました。

実装

var i = 1;                     //  set your counter to 1

function myLoop () {           //  create a loop function
   setTimeout(function () {    //  call a 3s setTimeout when the loop is called
      alert('hello');          //  your code here
      i++;                     //  increment the counter
      if (i < 10) {            //  if the counter < 10, call the loop function
         myLoop();             //  ..  again which will trigger another 
      }                        //  ..  setTimeout()
   }, 3000)
}

myLoop();