Dom 学習の概要と、examples_javascript スキルの使用方法の紹介

1. 指定したアドレスに再度移動します: navigate("http://www.jb51.net");

2、

(1. *setInterval は指定されたコードを一定間隔で実行します。最初のパラメータはコードの文字列、2 番目のパラメータは間隔時間 (単位: ミリ秒)、戻り値はタイマーの識別子です。例:

setInterval("alert('hello')",5000);

*clearInterval は、setInterval のスケジュールされた実行をキャンセルします。これは、Timer の Enabled=False に相当します。 setInterval は複数のタイミングを設定できるため、clearInterval には、setInterval の戻り値であるクリアするタイマーの識別子を指定する必要があります。

var intervalld= setInterval("alert('hello')",5000);
clearInterval(intervalld);

(2. setTimeout もスケジュール実行ですが、setInterval のようなスケジュール実行ではありません。時間を設定してから一度だけ実行されます。clearTimeout もクリアタイミングです。
見分けるのは簡単です: 間隔はタイミング、タイムアウトはタイムアウトです。

var timeoutld=setTimeout("alert('hello')",2000);

(3. ケース: タイトル バーの回転ドアの効果を実現する、つまり、ブラウザのタイトル テキストが 500 ミリ秒ごとに右にスクロールする

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

マーキー効果


/title & gt
& lt; スクリプト タイプ = "text/javascript" & gt; ;
関数 Scroll () {
var Title = document.tital (0); var last = title.substring(1, title.length); ;
head>






3.

(1. onload: Web ページが読み込まれるときにトリガーされます。ブラウザはドキュメントをダウンロードし、同時に解析して実行します。JavaScript の実行時に特定の要素の操作が必要になる場合があります。この要素には、ロードされていない場合は、コードを本体の onload イベントに配置するか、要素自体がロードされるときに要素の onload イベントをトリガーすることができます。
(2. onunload: Web ページ。閉じた (または終了した) 後にトリガーされます。onbeforeunload: ウィンドウが終了したとき (前進、後退、終了など)、確認メッセージがポップアップ表示されます。 ) 例: ? ''>

4、

固有の属性に加えて、一般的な HTML 要素のイベントももちろんあります: onclick (クリック)、ondblclick (ダブルクリック)、onkeydown (キーが押された)、onkeyup (キーが放された)、onkeypress (ボタンをクリック) 、onmousedown (マウスが押された)、onmousemove (マウスが移動した)、onmouseout (マウスが要素範囲を離れる)、
onmouseover (マウスが要素範囲に移動する)、onmouseup (マウス ボタンが放される) など。

5. ウィンドウオブジェクトのプロパティ

(1. window.location.href="http://www.sina.com.cn"、新しいアドレスにリダイレクトします。navigate メソッドと同じ効果があります。window.location.reload() は、 page.
(2. window.event は、イベントが発生したときに情報を取得するために使用される非常に重要な属性です。イベントは window オブジェクトのイベントに限定されません。すべての要素のイベントは、event 属性を通じて関連情報を取得できます。
a. altKey 属性、ブート タイプは、イベントの発生時に Alt キーが押されたかどうかを示します。同様の属性には、ctrlKey とShiftKey があります。

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

Windows イベントの例







"
="クリック" onclick="if(window.event.ctrlKey){alert('Ctrl を押した')}else{alert('通常のクリック')}" /> : //www.baidu.com "クライト=" Alert ('アクセス禁止!'); Window.event.returnValue = false; px " >

;

gt;

b. clientX、clientY は、イベントが発生したときのクライアント領域 (ブラウザー ページ内) のマウスの座標です。screenX、screenY は、イベントが発生したときの画面上のマウスの座標です。イベント ソース (ボタン ボタン) の座標を基準としたマウスを基準にして発生します。
c、returnValue 属性、returnValue が false に設定されている場合、デフォルトのイベントの処理はキャンセルされます。
d、srcElement: イベント ソース オブジェクトを取得します。
e、KeyCode: 時刻が発生したときのキー値
f、button: 時刻が発生したときのマウス ボタン、1 は左ボタン、2 はマウスのボタンです。右ボタン、3は左ボタンの同時押しです。

6.clipboardData オブジェクト、ペーストボード上の操作。 clearData("Text") はペーストボードをクリアします。 getData("Text") はペーストボードの値を読み取り、戻り値はペーストボードの内容です。 setData("Text",val) はペーストボードの値を設定します。

(1. コピーする際、body の oncopy メソッドが起動されます。コピーを禁止するには、直接 false を返します。

( 2 、多くの要素には oncopy および onpaste イベント もあります。

例 1: コピー禁止

例 3: テキスト ボックスへの貼り付けを無効にする

携帯電話番号を入力してください:

携帯電話番号をもう一度入力してください: :

例 4: コピー時に添付されるコンテンツ

ウェブサイト上の記事をコピーする場合、コピー作成者が記事の出典を追加しないことを防ぐために、コピーされたコンテンツの後に著作権ステートメントが自動的に追加されます。

関数modifyClipboard(){

ClipboardData.setData('Text',clipboardData.getData('Text') 'この記事はブログ パーク テクノロジー ゾーンからのものです。転載する場合は出典を明記してください。' location.href);

}

oncopy="setTimeout ('modifyClipboard()',100)"。

ユーザーは、コピー アクションが発生してから 0.1 秒後にペーストボードのコンテンツを変更します。 100ms は一般的な値であり、1000、10、50、20... と書き込むことができます。 oncopy ではペーストボード上で操作を直接実行することはできないため、0.1 秒後に実行されるようにタイマーを設定して、oncopy 実行コール スタックから削除します。

7. ページ送りとページ戻し: 履歴操作履歴

window.history.back() は後戻りし、window.history.forward() は前進します。 window.history.go(-1) を使用して前方に移動し、window.history.go(1) を使用して後方に移動することもできます。

例 1:

これは 2 ページです戻る

8. Document 属性 (最も複雑な属性) document は window オブジェクトの属性です。window オブジェクトのメンバーを使用するとウィンドウが省略できるため、通常は document を直接記述します。

(1. Write: コンテンツをドキュメントに書き込みます。writeln は write と似ていますが、最後に復帰が追加される点が異なります。(2.

(3. onclick やその他のイベントで書かれたコードはページのコンテンツをフラッシュし、ページの読み込み時に、書き込みは元のコンテンツと統合されます

(4.

ケース 1:

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

getElementById

form>




ケース 2:

コードをコピー

コードは次のとおりです:

getElementByName

案例 4：

复制幣

代码如下:

読み取りプロトコル待機タイマー


var leftTime = 10;
var TimeID;
functionscroll() {//alert(222);
var btn = document.getElementById("btnAgree");
//場合Web ページが非常に遅い。時間が設定されている可能性があります。サーバーの実行中にコントロールが読み込まれていません。
btn.disabled = "";
value = "契約書を読んで同意してください (残り時間は " leftTime " 秒です)";
leftTime--;
gt;

body>






ケース 5:




コードをコピー


コードは次のとおりです:

美容時計










< ;/html>


16. フォーム form: Form オブジェクトはフォームの Dom オブジェクトです。

メソッド: submit() はフォームを送信しますが、onsubmit イベントはトリガーしません。 自動投稿を実装します。つまり、カーソルが送信ボタンを離れた後にのみ送信されるのではなく、フォーカスがコントロールを離れた直後にページが送信されます。onblur イベントがトリガーされ、フォームの submit メソッドが呼び出されます。オンブラー。送信をクリックすると、フォームの onsubmit イベントがトリガーされ、データに問題がある場合は false を返して送信をキャンセルできます。

ケース 1:




コードをコピー

コードは次のとおりです:

フォーム


フォーム

** コンパイル 実行速度を向上させるために式をコンパイルします。 ( * )
*String オブジェクトは、正規表現に関連するいくつかのメソッドを提供します。これらのメソッドは、呼び出しを簡素化するために RegExp クラスをラップするのと同等です: match(regexp)。これは、exec

の呼び出しと同等です。
var s = "aaa@163.com";
var regex = /(. )@(. )/;
var match = s.match(regex); $1 "、サーバー: " RegExp.$2);
ケース 1:




コードをコピー


コードは次のとおりです:

正規表現



var regex = /(.)@(.) /;
アラート (正規表現 $ 1);アラート(RegExp.$2); ; /html>


18. ブラウザごとの違い

19. キーボードコード操作と金融ボックスのケース:

ケース 1:

金融関連システムの金額を含むテキスト ボックスには次の要件があります:

*金額テキスト ボックスを入力し、中国語以外の入力方法を使用しないでください。テキスト ボックスにフォーカスがある場合、テキスト ボックスは左揃えになります。テキスト ボックスは右揃えで表示され、入力メソッドを無効にします: style=" ime-mode:disabled"

* 不正な値を入力することは禁止されています。これらの値のみを入力できます (k == 9) || (k == 13) ||

(k==46)||(k==8) ||( k==189)||(k==109)||(k==190)||(k==110)|| (k>=48 &&

k =96 && k=37 && knumonKeyDown()" イベント応答関数とイベント応答関数によって呼び出される関数を区別するために onkeydown="numonKeyDown()" と記述しないでください。

* 貼り付けを無効にする (優れたテスター)、 を使用してペーストボード内の値を取得し、各文字を走査してそれが正当な値であるかどうかを確認します。ただし、貼り付けは、すべてが正当な値である場合にのみ許可されます。不正な値があります 貼り付けは禁止されています。 charAt、charCodeAt 千の位を追加するメソッド

* フォーカスがオンの場合は 1000 分の 1 なしで左揃え、フォーカスがオンになっていない場合は右揃え: this.style.textAlign='right'

コードをコピー

コードは次のとおりです:

財務テキスト ボックスの設定

ケース 3: 全選択、非選択、逆選択を実現するチェックボックス

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

チェックボックスの選択

犬に任せる

シャワーを浴びる

ファイア ハート

中国

案例 4：权制限选择

复制代码代码如下:

Permission selection

> ;