HTML DOM Document images 属性

定義と用法

images 属性返回文档中所有 <img> 元素的集合。

images 属性は HTMLCollection

画像s 属性は読み取り専用です。

ヒント:images 属性は type="image" の <input> 要素を返しません。

HTMLCollection

HTMLCollection HTML 要素の配列に似たコレクション(リスト)です。

インデックスを通じてコレクション内の要素にアクセスできます(0から始まる)。

length 属性はコレクション内の要素の数を返します。

参照もしくは関連する項目:

画像

HTML <img> タグ

HTML イメージチュートリアル

インスタンス

例1

ドキュメント内の <img> 要素の数:

document.images.length;

実際に試してみてください

例2

すべての <img> 要素を巡回し、各要素の URL(src)を出力します:

const myImages = document.images;
let text = "";
for (let i = 0; i < myImages.length; i++) {
  text += myImages[i].src + "<br>";
}

実際に試してみてください

例3

最初の <img> 要素の URL は:

document.images[0].src;

実際に試してみてください

例4

最初の <img> 要素の URL は:

document.images.item(0).src;

実際に試してみてください

例5

id="myImg" の <img> 要素の URL は:

document.images.namedItem("myImg").src;

実際に試してみてください

例6

最初の <img> 要素に黒い枠線を追加します:

document.images[0].style.border = "10px dotted black";

実際に試してみてください

構文

document.images

属性

属性 説明
length コレクション内の <img> 要素の数。

メソッド

メソッド 説明
[item(]

index

指定されたインデックスの要素(0から始まる)を返します。

)item(namedItem(

index

指定されたインデックスの要素(0から始まる)を返します。

インデックスが範囲外の場合、null を返します。の要素がnamedItem(

) の要素が を指定する

存在する場合 の要素が id

存在しない場合、null を返します。

タイプ 説明
オブジェクト

HTMLCollection オブジェクト。

ドキュメント内のすべての <img> 要素。

ソースコード内での出現順序に従って並べ替えます。

ブラウザのサポート

document.images DOMレベル1(1998)の機能です。

すべてのブラウザがサポートしています:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
サポート 9-11 サポート サポート サポート サポート