imageObject.altは、image要素のalt属性の値を取得、もしくは、設定するプロパティ。
alt属性には、画像の代替テキストを指定する。src属性に指定した画像が見付からなかったとき、alt属性に指定した代替テキストを表示する。
構文
取得
var $alt = $imageElementReference.alt;
戻り値
image要素のalt属性の値。画像の代わりに表示する文字列。
設定
$imageElementReference.alt = "代替テキスト";
- 代替テキスト
- 画像の代わりに表示する文字列を指定。
サンプル
image要素のalt属性の値:
サンプルの動作について
- 「サンプル画像」ボタンをクリックすると、alt属性値を「サンプル画像」にする。「image要素のalt属性の値:」の右横に「サンプル画像」と表示する。
- 「サンプルイメージ」ボタンをクリックすると、alt属性値を「サンプルイメージ」にする。「image要素のalt属性の値:」の右横に「サンプルイメージ」と表示する。
- 「サンプル」ボタンをクリックすると、alt属性値を「サンプル」にする。「image要素のalt属性の値:」の右横に「サンプル」と表示する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
function setAlt( $alt ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.alt = $alt;
var $alt = $elementReference.alt;
document.getElementById( "sampleOutput" ).innerHTML = $alt;
}
</script>
function setAlt( $alt ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.alt = $alt;
var $alt = $elementReference.alt;
document.getElementById( "sampleOutput" ).innerHTML = $alt;
}
</script>
HTML
<p>
<button onclick="setAlt('サンプル画像');">サンプル画像</button>
<button onclick="setAlt('サンプルイメージ');">サンプルイメージ</button>
<button onclick="setAlt('サンプル');">サンプル</button>
</p>
<p>image要素のalt属性の値:<span id="sampleOutput"></span></p>
<image src="http://alphasis.info/library/javascript/jquery/plugin/cycle/sample/1.jpg" alt="サンプル画像" id="sample">
<button onclick="setAlt('サンプル画像');">サンプル画像</button>
<button onclick="setAlt('サンプルイメージ');">サンプルイメージ</button>
<button onclick="setAlt('サンプル');">サンプル</button>
</p>
<p>image要素のalt属性の値:<span id="sampleOutput"></span></p>
<image src="http://alphasis.info/library/javascript/jquery/plugin/cycle/sample/1.jpg" alt="サンプル画像" id="sample">