imageObject.altプロパティ

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>

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">

スポンサード リンク

カテゴリー: DOM, Imageオブジェクト, JavaScript, リファレンス パーマリンク