ダイナミック HTML (DHTML) を使用してインタラクティブなページを作成する方法
7io /ゲッティイメージズ
動的 HTML は実際には HTML の新しい仕様ではなく、標準の HTML コードとコマンドを見て制御する別の方法です。
ダイナミックを考えるとき HTML 、標準の HTML の品質を覚えておく必要があります。特に、ページがサーバーから読み込まれると、別の要求がサーバーに届くまで変更されません。動的 HTML を使用すると、HTML 要素をより詳細に制御でき、Web サーバーに戻らずにいつでも変更できます。
DHTML には 4 つの部分があります。
- ドキュメント オブジェクト モデル (DOM) (定義)
- スクリプト
- カスケード スタイル シート (CSS)
- XHTML
ドム
DOM は、Web ページの任意の部分にアクセスして DHTML で変更できるようにするものです。 Web ページのすべての部分は DOM によって指定され、一貫した命名規則を使用してそれらにアクセスし、それらのプロパティを変更できます。
スクリプト
JavaScript または ActiveX で記述されたスクリプトは、DHTML をアクティブ化するために使用される最も一般的な 2 つのスクリプト言語です。スクリプト言語を使用して、DOM で指定されたオブジェクトを制御します。
カスケード スタイル シート
CSS は、Web ページのルック アンド フィールを制御するために DHTML で使用されます。スタイル シートは、テキストの色とフォント、背景色と画像、およびページ上のオブジェクトの配置を定義します。スクリプトと DOM を使用して、さまざまな要素のスタイルを変更できます。
XHTML
XHTML または HTML 4.x を使用して、ページ自体を作成し、CSS および ドム 取り組むこと。 DHTML 用の XHTML について特別なことは何もありませんが、有効な XHTML を使用することはさらに重要です。ブラウザーだけでなく、XHTML から動作するものも多くあるからです。
DHTML の機能
DHTML の主な機能は次の 4 つです。
- タグとプロパティの変更
- リアルタイム測位
- 動的フォント (Netscape Communicator)
- データバインディング (Internet Explorer)
タグとプロパティの変更
これは、DHTML の最も一般的な用途の 1 つです。それはあなたがの質を変えることを可能にします HTML タグ ブラウザー外のイベント (マウスのクリック、時刻、日付など) に応じて。これを使用して、情報をページにプリロードし、読者が特定のリンクをクリックしない限り表示しないようにすることができます。
リアルタイム測位
ほとんどの人が DHTML について考えるとき、これは彼らが期待するものです。 Web ページ内を移動するオブジェクト、画像、およびテキスト。これにより、リーダーとインタラクティブなゲームをプレイしたり、画面の一部をアニメーション化したりすることができます。
動的フォント
これは Netscape のみの機能です。 Netscape はこれを開発して、設計者がリーダーのシステムにどのようなフォントがあるかを知らなかったという問題を回避しました。ダイナミック フォントを使用すると、フォントがエンコードされ、ページと共にダウンロードされるため、常にデザイナーが意図したとおりにページが表示されます。使用することもできます Web セーフ フォント .
データバインディングこれは IE のみの機能です。 Microsoft は、より簡単にアクセスできるようにこれを開発しました。 Web サイトからのデータベース .使用するのと非常によく似ています CG データベースにアクセスできますが、ActiveX コントロールを使用して機能します。この機能は非常に高度で、初心者の DHTML ライターには使いにくいものです。