検索

ホームページ >ウェブフロントエンド >jsチュートリアル >js DOM学習メモ_javascriptスキル

js DOM学習メモ_javascriptスキル

WBOY
WBOYオリジナル
2016-05-16 17:57:551194ブラウズ

今日は DOM について学習し、次の基本的な演習を行いました...
DOM は Document Object Model の略で、DHTML 開発で DOM を操作するために JavaScript を使用します。
学習目標: JavaScript を使用して Dom を操作し、一般的な DHTML 効果を実現できるようになります。
参考書籍: Zhang Xiaoxiang の『JavaScript Web 開発 - 体験学習チュートリアル』
1. DOM の概要:
1. DOM は HTML ページのモデルとして扱われます。 DOM の属性とメソッドを呼び出すことで、Web ページ内のテキスト ボックス、レイヤー、その他の要素をプログラムで制御します。たとえば、テキスト ボックスの DOM オブジェクトを操作することで、テキスト ボックスの値を読み取って設定できます。
2. DOM は、WinForm と同様、イベント、プロパティ、メソッドを通じてプログラムできます。
3. CSS JavaScript DOM=DHTML (つまり、HTML 言語の拡張機能。ドキュメントとオブジェクトのプレゼンテーション効果を高めることができます。)
2. イベント:
1. body onmousedown="alert('haha')">onmousedown 内のコードは、マウスがクリックされたときに実行されます。時間イベントに応答するにはコードが多すぎる場合は、別の関数
に入れます。

コードをコピー コードは次のとおりです。



注意: bodymousedown の後の括弧は失われることはありません。これは、onmousedown イベントの応答関数が bodymousedown であるのではなく、bodymousedown 関数を呼び出すことを意味するためです。
2. イベントを動的に設定する:
イベント応答関数は、.Net の「btn.Click=」と同様に、コード内で動的に設定できます。

コードをコピー コードは次のとおりです:
.org/1999/xhtml"> ;head>








5) clearInterval は、setInterval のスケジュールされた実行をキャンセルします。これは、Timer の Enabled=False に相当します。 setInterval は複数のタイミングを設定できるため、clearInterval には、setInterval の戻り値であるクリアするタイマーの識別子を指定する必要があります。 var intervalld= setInterval("alert('hello')",5000);
clearInterval(intervalld);
6) setTimeout も定期的に実行されますが、setInterval のように定期的に実行されるのではなく、設定された時間が経過した後に実行されます。一度だけ実行され、clearTimeout はクリア時間でもあります。
区別は簡単です。インターバルはタイミングを意味し、タイムアウトはタイムアウトを意味します。例: var timeoutld=setTimeout("alert('hello')",2000);
ケース: タイトル バーの回転効果、つまりブラウザのタイトル テキストが 500 ミリ秒ごとに右にスクロールすることを実現します。ヒント: タイトルは document.title 属性です。
4. 1) onload: Web ページが読み込まれるときにトリガーされます。JavaScript が読み込まれていないときに、ブラウザがドキュメントをダウンロードするときに、特定の要素を操作する必要がある場合があります。この場合、操作を本体の onload イベントに配置するか、要素の後に JavaScript を配置する必要があります。要素の onload イベントは要素自体が読み込まれるときにトリガーされ、本体内の onload はすべての読み込みが完了したときにトリガーされます。
2) onunload: Web ページが閉じられた (または終了した) 後にトリガーされます。イベント（表示する警告メッセージ）の「Window.event.returnValue」に値を代入すると、ウィンドウを離れるとき（進む、戻る、閉じるなど）に確認メッセージが表示されます。例:
コードをコピー コードは次のとおりです。