HTML img属性 "complete"

Question

誰でも属性の意味を説明できますかcomplete？

私はDOMと関係があると考えています。

<img src="/folder/pic.jpeg" complete="complete" /> 

Answer 1

イメージがダウンロードされたときに設定されます。

例のようにHTMLで明示的に見たことがありません（MDNはimg要素の属性ではありません）。私はちょうど、画像がJavaScriptでダウンロードされているかどうかを確認するために使用します（しかし、それにクロスブラウザの問題があります）。 HTMLImageElementのプロパティはBooleanを返します。

[].forEach.call(document.querySelector("img"), function(img) { 
    // Loaded? 
    img.complete && (img.style.border = "5px solid #f00"); 
}); 

Answer 2

画像の読み込みが完了したかどうかを確認するために使用されます。

document.getElementsByTagName('img')[0].complete 

は、読み込みが完了するとtrueを返し、そうでない場合はfalseを返します。 しかし、あなたの例のように属性として使用されていません。

Answer 3

属性completeは仕様で定義された意味がなく、効果がない可能性があります（getAttribute()メソッドで読み取ることはできますが）。だから問題のコードはおそらくいくつかの誤解に基づいている。

はHTML5ドラフトによれば、HTMLImageElementインターフェースに従って、img要素に対応するオブジェクトのcomplete性あります。 definition of the complete propertyは基本的に、ブラウザが画像を完全に受信したときに値が真であることを意味します（ここでは微妙な違いがあります）。これはブラウザによって制御されるため、読み込みステータスを反映して、プロパティが読み取り専用に定義されているのは当然です。

このプロパティは広く存在するブラウザですが、明らかに壊れた方法で表示されます：存在しないリソース（404 Not Found）を参照するimg要素がある場合、ChromeとFirefoxはプロパティの値がtrueここで物事を取得する：false）。だから、当分の間、このプロパティはあまり使用されていません。

HTMLで属性を設定しても影響はありません。 HTMLアトリビュートとエレメントオブジェクトのプロパティは、対応が定義されている場合にのみ、互いに対応します。