imgNN 3 IE 4 DOM 1

img オブジェクトは img 要素に対応するオブジェクトです。このオブジェクトのプロパティは、静的な Image オブジェクトのプロパティと共通で、イメージをページに表示する前にキャッシュに読み込むことができます。

 
相当する HTML コード
 
<img>
 
オブジェクト参照
 
[window.]document.imageName
[window.]document.images[i]
[window.]document.images["imageName"]
[window.]document.getElementById("elementID")
 
オブジェクト固有のプロパティ
 
alignaltbordercomplete
dataFlddataFormatAsdataSrcdynsrc
fileCreatedDatefileModifiedDatefileSizefileUpdatedDate
heighthrefhspaceisMap
longDesclooplowsrclowSrc
mimeTypenamenamePropnaturalHeight
naturalWidthprotocolprototypesrc
startuseMapvspacewidth
xy
 
オブジェクト固有のメソッド

なし

 
オブジェクト固有のイベントハンドラープロパティ
 
イベントWindows 版 IEMacintosh 版 IENNW3C DOM
onabort4432
onerror4432
onload443なし
alignNN 6 IE 4 DOM 1

読み書き

周りのテキストコンテンツに対する要素の位置揃え方法を示します。ほとんどの値は、要素と周りのテキストとの縦の配置を設定するものです。たとえば、要素の下を周りのテキストのベースラインに揃えるには、align プロパティの値を baseline に設定します。要素を左マージンや右マージンに沿ってフロートさせ、テキストが要素の周りを囲むようにも設定できます。

 
 
document.logoImg.align = "absmiddle";
 

位置揃え方法を指定する absbottomabsmiddlebaselinebottomrightleftnonetexttoptop のいずれかの定数を示す文字列

 
既定値

bottom

altNN 6 IE 4 DOM 1

読み書き

ブラウザがグラフィックをダウンロードしない場合やイメージのダウンロード完了を待っている間に img 要素の代わりに表示する (または読み上げる) テキストを示します。このテキストは通常、イメージの内容を説明する短い文です。ページ上に表示できるテキストの文字数は、イメージ領域のサイズに応じて決まります。表示範囲に収まるテキストを設定してください。

 
 
document.corpLogo.alt = "MegaCorp Logo";
 

文字列

 
既定値

なし

borderNN 3 IE 4 DOM 1

読み書き (IE および Netscape 6)

要素の周りのボーダーの太さをピクセル数で示します。このプロパティは Navigator 4 では読み取り専用です。

 
 
document.logoImage.border = 4;
 

整数。0 に設定するとボーダーがまったく表示されません。

 
既定値

0

completeNN 3 IE 4 DOM なし

読み取り専用

img 要素の src または lowsrc のイメージファイルの読み込みが完了したかどうかを報告します。Navigator 4 ではイメージの読み込みが完了していなくても、間違って true を返すので注意が必要です。

 
 
if (document.logo.complete) {
    // safe to process the image object
}
 

true または false のブール値

 
既定値

false

dataFldNN なし IE 4 DOM なし

読み書き

IE のデータバインディングと共に使用して、リモートデータソースの列名を img オブジェクトの src プロパティに関連付けます。この要素には datasrc 属性も設定する必要があります。dataFlddataSrc の両方のプロパティに空の文字列を設定すると、要素とデータソースのバインディングが壊れます。Macintosh 版 IE 5 ではテキストファイルのデータソースに対してのみ機能します。

 
 
document.myImage.dataFld = "logoURL";
 

データソースの列の識別子。大文字と小文字は区別されます。

 
既定値

なし

dataFormatAsNN なし IE 4 DOM なし

読み書き

このプロパティは IE の img 要素オブジェクトのメンバーですが、img には適用されません。これは、データバインディングの値が、表示されるコンテンツにではなく、src 属性にリンクされているためです。

dataSrcNN なし IE 4 DOM なし

読み書き

IE のデータバインディングと共に使用して、リモートデータアクセス用にデータソースオブジェクトを読み込むページの object 要素の ID を示します。dataFlddataSrc の両方のプロパティに空の文字列を設定すると、要素とデータソースのバインディングが壊れます。Macintosh 版 IE 5 ではテキストファイルのデータソースに対してのみ機能します。

 
 
document.myImage.dataSrc = "DBSRC3";
 

データソースの識別子。大文字と小文字は区別されます。

 
既定値

なし

dynsrcNN なし IE 4 DOM なし

読み書き

img 要素を介して表示するビデオクリップの URL です。このプロパティを変更すると、イメージオブジェクトに新しいビデオクリップが読み込まれます。ビデオクリップの再生回数を設定するには、loop プロパティを参照してください。

 
 
document.images[3].dynsrc = "snowman.avi";
 

絶対 URL または相対 URL を示す文字列

 
既定値

なし

fileCreatedDateNN なし IE 4(Win)/5(Mac) DOM なし

読み取り専用

サーバー (またはローカルのファイルシステム) から通知された、現在読み込まれているファイルの作成日付 (時刻は含まず) を表す文字列を返します。非表示の Image オブジェクトにイメージを読み込むと、スクリプトを通じてイメージの日付を判断できるようになります。ただし、より正確な日付情報は fileUpdatedDate プロパティから取得します。日付情報は、IE 4 ではロングフォーマットでしたが、IE 5 からは mm/dd/yyyy のフォーマットが採用されています。IE でサポートされていない日付フォーマットがサーバーから通知されると、値が崩れる場合があります。Macintosh 版 IE 5 にも実装されていますが、値は空です。

 
 
var dateObj = new Date(document.logoImg.fileCreatedDate);
 

日付を表す文字列

 
既定値

なし

fileModifiedDateNN なし IE 4(Win)/5(Mac) DOM なし

読み取り専用

サーバー (またはローカルのファイルシステム) から通知された、現在読み込まれているファイルの最終更新日付 (時刻は含まず) を表す文字列を返します。日付情報は、IE 4 ではロングフォーマットでしたが、IE 5 からは mm/dd/yyyy のフォーマットが採用されています。IE でサポートされていない日付フォーマットがサーバーから通知されると、値が崩れたり、不正確になる場合があります。Macintosh 版 IE 5 にも実装されていますが、値は空です。

 
 
var dateObj = new Date(document.logoImg.fileModifiedDate);
 

日付を表す文字列

 
既定値

なし

fileSizeNN なし IE 4(Win)/5(Mac) DOM なし

読み取り専用

現在読み込まれているイメージのサイズを表すバイト数を返します。戻り値は、Windows 版 IE では文字列、Macintosh 版 IE では数値 (ただし、値は 0) です。

 
 
var byteCount = parseInt(document.fileSize, 10);
 

Windows の場合は文字列を表す整数、また Macintosh の場合は数値を表す整数

 
既定値

なし

fileUpdatedDateNN なし IE 5(Mac)/5.5(Win) DOM なし

読み取り専用

サーバーから取得したイメージファイルの場合、このプロパティには、ファイルが最後にサーバーにアップロードされた日付が、日付情報に関連する他のプロパティよりも正確に反映されています。ローカルファイルの場合は、通常、空の文字列が返されます。Macintosh 版 IE 5 にも実装されていますが、値は空です。

 
 
var dateObj = new Date(document.logoImg.fileUpdatedDate);
 

日付を表す文字列

 
既定値

なし

height、widthNN 3 IE 4 DOM 1

読み書き (IE および Netscape 6)

img 要素に表示されるイメージの高さと幅をピクセル数で示します。これらの値に行った変更は、Internet Explorer 4 以降と Netscap 6 では、ページで再フローされたコンテンツに直ちに反映されます。イメージのサイズは新しい設定に合わせて拡大および縮小されます。

 
 
document.prettyPicture.height = 250;
 

整数

 
既定値

なし

hrefNN なし IE 4 DOM なし

読み書き

要素の src 属性で設定された URL です。このプロパティの代わりに src プロパティの使用が推奨されています。

 
 
document.logoImage.href = "images/fancyLogo.gif";
 

絶対 URL または相対 URL を示す文字列

 
既定値

なし

hspace、vspaceNN 3 IE 4 DOM 1

読み書き (IE および Netscape 6)

イメージオブジェクトの周りの横マージンと縦マージンをピクセル数で示します。hspace プロパティは、要素の左右に均等に追加されるマージンを、vspace は、要素の上下に均等に追加されるマージンを設定します。これらのマージンはスタイルシートで設定されるマージンとは異なりますが、視覚的には同じ効果があります。

 
 
document.logo.hspace = 5;
document.logo.vspace = 8;
 

ピクセル数を示す整数

 
既定値

IE の場合は 0、Netscape 6 の場合は -1

isMapNN 6 IE 4 DOM 1

読み書き

img 要素をサーバー側のイメージマップとして機能させるかどうかを示します。イメージがサーバー側のイメージマップとして機能させるには、イメージを a 要素で囲み、その href 属性を、クリック位置を解釈する CGI プログラムの URL に設定する必要があります。ブラウザは、クリック位置を示す座標値を URL に追加します。これは、get フォームメソッドがフォーム要素のデータを action 属性 URL に追加するのと同じ方法です。

 

最近のブラウザではクライアント側のイメージマップを使用できます (useMap プロパティを参照)。クライアント側のイメージマップはクリック位置を解釈する際にサーバーと通信する必要がないので、ユーザーの待ち時間を短縮できます。

 
 
document.navMap.isMap = true;
 

true または false のブール値

 
既定値

false

longDescNN 6 IE 5(Mac)/6(Win) DOM 1

読み書き

img 要素の longDesc 属性に対応するプロパティです。バージョン 6 のブラウザでは、この属性やプロパティに特別な機能はありません。

 

URL 文字列

 
既定値

空の文字列

loopNN なし IE 4 DOM なし

読み書き

dynsrc 属性でビデオクリップを指定した場合、loop プロパティでクリップの再生回数を制御します。この値を -1 に設定すると連続ループとなり、連続して再生されます。

 
 
document.movieImg.loop = 3;
 

整数

 
既定値

1

lowsrcNN 3 IE 4 DOM なし

読み書き (IE および Netscape 6)

src 属性で指定されたイメージのダウンロードに時間がかかる場合に代わりに読み込む、低解像度イメージまたは代替イメージの URL を示します。lowsrc 属性に指定するイメージは、src 属性に指定されている元のイメージと同じピクセルサイズである必要があります。lowsrc プロパティを変更する必要があるのは、src プロパティを変更する場合だけです。その場合、まず最初に lowsrc プロパティを変更して、ブラウザが src イメージのダウンロードに長時間かかる場合の処理方法を設定します。

 

Netscape 6 には、このプロパティのバリエーションとして、大文字を使用した lowSrc も実装されています。ただし、どちらのプロパティも W3C DOM では規定されていません。

 
 
document.productImage.lowsrc = "images/widget43LoRes.jpg";
 

絶対 URL または相対 URL を示す文字列

 
既定値

なし

mimeTypeNN なし IE 6(Win) DOM なし

読み取り専用

イメージの MIME タイプを表す標準テキストの文字列を返します。このプロパティは、Microsoft 製品では正式サポートされていないようですが、標準的なイメージをローカルディスクとサーバーのどちらから取得した場合も、正しい値が通知されるようになっています。

 
 
if (document.productImage.mimeType.indexOf("JPEG") != -1) {
    // process condition for jpeg image
}
 

JPEG ImageGIF Image などの文字列

 
既定値

なし

nameNN 2 IE 3 DOM 1

読み書き

イメージオブジェクトに関連付けられた識別子です。スクリプトでオブジェクトを参照する場合に使用します。

 
 
var imgName = document.images[3].name;
 

識別子の命名規則に従った文字列。大文字と小文字は区別されます。識別子には空白スペースは使用できず、1 文字目に数字は使用できません。アンダースコア以外の句読点の使用は避けてください。

 
既定値

なし

namePropNN なし IE 5(Win) DOM なし

読み取り専用

現在のイメージのファイル名 (URL パスの他の部分は除く) を返します。現在のイメージコンテンツの検査が容易に行えます。

 
 
if (document.images[3].nameProp == "menuOn.jpg") {
    document.image[3].src = "../images/menuOff.jpg";
}
 

ファイル名と拡張子。大文字と小文字は区別されます。

 
既定値

なし

naturalHeight、naturalWidthNN 6 IE なし DOM なし

読み取り専用

イメージの本来の (拡大縮小されていない) 高さと幅を示すピクセル数を返します。スクリプトや要素オブジェクトの誤りによりイメージが拡大または縮小されている場合に、スクリプトを介してイメージの本来のサイズを知ることができます。

 
 
document.logoImg.height = document.logoImg.naturalHeight;
document.logoImg.width = document.logoImg.naturalWidth;
 

整数

 
既定値

なし

protocolNN なし IE 4(Win)/5(Mac) DOM なし

読み取り専用

要素に関連付けられている URL のプロトコル部分を返します。Windows 版と Macintosh 版では、戻り値のフォーマットが異なります。Windows 版では、標準テキストの長い文字列 (File ProtocolHyperText Transfer Protocol など)、Macintosh 版では、location.protocol に類似した値 (file:http: など) が返されます。Windows 版 IE 4 の値は確実ではありません。

 

文字列

 
既定値

なし

prototypeNN なし IE 4(Mac) DOM なし

読み取り専用

イメージオブジェクトのすべてのインスタンスの元になる、静的な Image オブジェクトへの参照を返します。この機構は JavaScript コア言語オブジェクトで多く使われます (第 12 章を参照)。このプロパティが機能するのは Macintosh 版 Internet Explorer 4 のみなので、あまり使用しない方が良いでしょう。

 

オブジェクトへの参照

 
既定値

object Image

srcNN 3 IE 4 DOM 1

読み書き

img 要素に現在読み込まれている、またはこれから読み込まれるイメージファイルの絶対 URL または相対 URL を示します。現在の img 要素に、サイズの異なるイメージを読み込むと、要素のサイズは新たに読み込まれたイメージに合わせて強制的に変更されます。ただし、Netscape 3、Netscape 4、および Macintosh 版 IE 3 のブラウザは例外です。このプロパティを読み取った場合、元の URL フォームで設定されていた値に関わりなく、戻り値は絶対 URL になります。

 
 
document.image[3].src = "../images/menuOff.jpg";
 

URL 文字列

 
既定値

なし

startNN なし IE 4 DOM なし

読み書き

dynsrc 属性でビデオクリップを設定した場合、start プロパティでクリップの再生を開始するアクションを制御します。

 
 
document.movieImg.start = "mouseover";
 

fileopen または mouseover の定数を示す文字列

 
既定値

fileopen

useMapNN 6 IE 4 DOM 1

読み書き

クライアント側のイメージマップのホットエリアおよびリンクが含まれているドキュメントにある、map 要素の URL を示します。設定する値には、img 要素の usemap 属性のマップ名にシャープ記号を付けます。

 
 
document.images[0].useMap = "#altMap";
 

シャープ記号と map 要素の名前から成る文字列

 
既定値

なし

vspace

hspace を参照してください。

width

height を参照してください。

x、yNN 4 IE なし DOM なし

読み取り専用

ページ上にあるイメージの左上隅の位置を示す X と Y の座標値をピクセル単位で示します。このプロパティは Navigator 専用です。Internet Explorer の offsetLeft プロパティと offsetTop プロパティに相当します。

 
 
var imageFromTop = document.logoImg.y;
 

整数

 
既定値

なし

readyStateNN なし IE 4 DOM なし

読み取り専用

オブジェクトのコンテンツにおける現在のダウンロードステータスを返します。ユーザーイベントによって呼び出されたスクリプトなどがドキュメントの読み込み中にアクションを行う可能性があり、ページ全体の読み込みが終了するまでは他のアクションを避ける必要がある場合は、このプロパティで読み込みの進行状況を調べることができます。その場合、条件テストでこのプロパティの値を使用してください。この値は、読み込みの最中でも、ダウンロードステータスが変わればそれに合わせて変更されます。プロパティ値が変わると、onReadyStateChange イベントが呼び出されますが、このイベントはバブルアップしません。

 

このプロパティは、IE 4 で導入された時点では、documentembedimglinkobjectscriptstyle の各オブジェクトでのみ使用できました。IE 5 では、すべての HTML 要素オブジェクトに使用できます。

 
 
if (document.readyState == "loading") {
    //statements for alternate handling while loading
}
 

object 要素以外のすべての要素については、uninitializedloadingloadedinteractivecomplete のいずれかの値を示す文字列。要素によっては読み込みが完了していないコンテンツでもユーザー操作を許可しますが、その場合は、読み込みが完了するまでこのプロパティが interactive を返すことがあります。すべての要素タイプにおいて、読み込み中にすべての値が順序どおりに返されるわけではありません。object 要素は、これら 5 つのステートに対応した数値を返します。数値の範囲は、0 (uninitialized) から 4 (complete) です。

 
既定値

なし

blur()NN 2 IE 3 DOM 1

現在のオブジェクトからフォーカスを削除し、オブジェクトの onblur イベントを呼び出します。IE の最新バージョンを除いたすべてのブラウザで、フォーカスとブラーに対応する要素 (イベントとメソッドの両方) の範囲が制限されています。第 8 章の共通 tabindex 属性を参照してください。下位互換性を保つには、テキスト input 要素や textarea 要素など、フォーカスを設定できる要素に blur() メソッドを適用します。要素を無効にする手段を持たないブラウザでは、たとえば、onfocus="this.blur();" 属性をテキスト input 要素に割り当ててフィールドを広範囲で無効にすることができます。これは、粗雑な方法ではありますが、下位互換性を保つには効果的です。

 

同じページでは blur() メソッドと focus() メソッドを控えめに使用してください。処理中に警告ダイアログボックスが表示されると、ブラーとフォーカスの無限ループを間違って実行してしまう可能性があります。また、1 つのオブジェクトで blur() メソッドを呼び出すと、window オブジェクトなど、別のオブジェクトが onfocus イベントを受け取ることがあります。

 
パラメータ

なし

 
戻り値

なし