JavaScriptで画像を制御していたら、IEだけうまく動かない場面が出てきてしまいました。
先回りしづらいonLoad
イメージが読み込まれたことを検知するときに、教科書的な手法としては、<img>のloadやerrorイベントを拾う方法があります。ただ、状況によってはイベントを付ける前にキャッシュから画像が読み込まれてしまって、うまく動かないことがあります。
完了報告のプロパティ
そんなこともあるからか、<img>のDOM上には、.completeというプロパティが用意されています。HTML5の勧告によれば、.completeは「画像のロードが完了した場合」以外にも、
-
src属性のない場合 - 画像が壊れていた（ファイル形式が合わない、404などアクセスできない）場合
にもtrueになるとされています。ダウンロード失敗でも、もうそれ以上画像は変わらないわけなのでcomplete、ということなのかもしれません。
I……E……？
ところが、Internet Explorerにかかれば、この仕様通りには動かず、リンク切れの画像はずっとcompleteがfalseのままとなります。
「全部の画像がcompleteしたとき」という状況を待っているコードがあったのですが、このお陰でIEだけ処理が先に進まなくなっていました。