Open Source Web Development Tutorials - Dev Shed

拡張Ajax手法によるActive Client Page
（2009/02/17公開）

innerHTMLプロパティ

　クライアントでコンテンツを生成する場合は、HTML要素の内容を変更できると便利です。innerHTMLプロパティでテーブルセルの内容を変えられることは、既にご存じでしょう。今日の多くのブラウザでは、ほとんどのHTML要素の内容を変更できます。

　次のようなコードについて考えてみます。

<html>
<head>
<script type="text/javascript">
function changeContent()
{
document.getElementById('S1').innerHTML = "two";
document.getElementById('D1').innerHTML = "second";
}
</script>
</head>
<body>
<span id="S1">one</span>
<div id="D1">First</div>
<button type="button" onclick="changeContent()">Click</button>
</body>
</html>

　ボタンをクリックすると、スクリプト内の関数により、SPANおよびDIV要素の内容が変更されます。ここでは、Webページまたはフォームがクライアント側で生成されるとき、HTML要素の内容を変更する必要がある可能性を示しています。この機能は、Active Client Pageに必須ではありません。補完的な機能として、上のコードを試してみてください。

画像

　Ajaxは、ユーザーに手順を意識させず、サーバーまたはXMLドキュメントから文字列を取得するために使います。このため、Active Client Pageでは、Ajaxによって画像を前もって取得することはできません。ただし、HTML OBJECT要素は画像を前もってダウンロード可能なことが判明しました。この件については別の記事で解説しますが、次のページで概要について紹介します。

前のページ 1 2 3 4 5 次のページ