完全なJavaScriptの実装は、ECMAScript(CORE)、BOM(ブラウザーオブジェクトモデル)、およびDOM(ドキュメントオブジェクトモデル)の3つの部分で構成される必要があることを知っています。
今日、私は主にBOMとDOMを学びます。
ボム:
BOMは、Webページのコンテンツとは何の関係もないブラウザの関数にアクセスするための多くのオブジェクトを提供します(これはDOMビジネスです)。現在、BOMはW3CによってHTML5仕様に移行されています。
ウィンドウオブジェクト:
BOMのコアは、ブラウザのインスタンスを表します。これは、JavaScriptを介してブラウザウィンドウにアクセスするインターフェイスと、ECMAScriptによって指定されたグローバルオブジェクトの両方です。これは、Webページで定義されているオブジェクト、変数、および機能がグローバルオブジェクトとしてウィンドウを持っているため、paresinint()などのメソッドにアクセスする許可があることを意味します。 (標高IIIからの抜粋)。さらに、Webページにフレームが含まれている場合、各フレームには独自のウィンドウオブジェクトがあり、フレームコレクションに保存されます(インデックス0 Starts、LTR、TTB)。
まず、グローバル実行環境の変数と関数はすべて、ウィンドウオブジェクトの属と方法です。もちろん、グローバル変数と直接定義されたウィンドウ属性の間には少し違いがあります。グローバル変数(正確には、グローバル変数を明示的に宣言する必要があります)は削除を使用できませんが、ウィンドウの属性は問題ありません。さらに、宣言されていない変数にアクセスしようとするとエラーが発生することに注意する別の詳細がありますが、クエリのウィンドウオブジェクトを使用しても問題ありません。
では、ウィンドウの一般的なプロパティまたは方法は何ですか?
1.Name、各ウィンドウオブジェクトには、フレームの名前が含まれる名前属性があります。通常、ウィンドウの関係とフレームワークを理解するため。
2。ウィンドウの位置方法:Moveto(新しい位置のX座標、新しい位置のy座標)、Moveby(Horizontal Movement X、垂直運動Y)。これらの2つの方法は、フレームワークには適用されません。
3。ウィンドウサイズの属性:内幅/高さ(ビューエリアのサイズ(境界の幅をマイナス)/ *ie、safari、firefox */)、外幅/高さ(ブラウザウィンドウのサイズ/ *ie、safari、firefox */)。クロムでは、内側と外側の両方がビューエリアのサイズを返します。
もちろん、Resizeto(新しいウィンドウ幅、新しいウィンドウの高さ)、サイズ(元の幅まで、元の高さと比較してYを増やす)によってウィンドウサイズを変更できます。このラブソング方法は、フレームワーク構造には適用されません。
4.Window.Open(URL、Window Target、Feature String、新しいページがブラウザ履歴の現在ロードされているページのブール値を置き換えるかどうか)を使用して、特定のURLに移動するか、新しいウィンドウを開きます。ウィンドウターゲットが指定され、ウィンドウターゲットが既存のウィンドウまたはフレームの名前である場合、指定されたURLは名前が変更されたウィンドウまたはフレームにロードされます。それ以外の場合、開く新しいウィンドウはターゲットウィンドウとして名前が付けられます。もちろん、ウィンドウターゲットが指定できるキーワードは、_self、_parent、_top、_blankです。
<a href = // www.vevb.com>私をクリックします</a> <script> var link = document.getElementsByTagname( "a")[0];アラート(link.nodename); window.onload = function(){link.onclick = function(){window.open(link.href、 "good"、 "width = 400px、height = 300px"); falseを返します。 }} </scriptここでは、機能文字列の特定の設定について詳しく説明していません。興味がある場合は、ここをクリックしてください
5.単一の読み取り言語として、JSは引き続きタイムアウト値(指定されたイベント後にコード実行)と間隔時間値(指定された時間ごとにループ)を設定して、特定の瞬間にコード実行をスケジュールすることができます。
タイムアウトコール:setimeout(JSコード文字列、ミリ秒時間)。シングルスレッド言語として、JSタスクキューは一度に1つのコードのみを実行できます。設定された時間間隔の後にタスクキューが空の場合、コード文字列は実行されます。それ以外の場合、実行する前に前のコードが実行されるまで待つ必要があります。
var al = setimeout(function(){alert( "good");}、5000);アラート(al); // 2ここでは、5秒後に匿名関数を呼び出して良好に出力しました。ウィンドウに警告ボックスが表示され、2が表示されます。SettimeOut()関数が数値IDを返すことがわかります。これは一意です。次に、このIDを介してタイムアウトコールをクリアでき、ClearTimeout(ID)を使用してクリアできます。
間接コール:SetInterval()、受け入れるパラメーターはsettimeout()と同じであり、数値IDを返し、ClearTimeout()でクリアされます。
6.システムダイアログボックスメソッド:alert()、ciend()、prompt()などは以前のブログで書かれています。ここをクリックしてください
ロケーションオブジェクト
BOMのオブジェクトではなく、場所はウィンドウオブジェクトのプロパティです。もちろん、後で説明するのはDOMのドキュメントオブジェクトのプロパティでもあります。つまり、window.locationとdocument.locationは同じオブジェクトを参照してください。
Location Object属性リスト、これらの属性を変更すると、新しいページを読み込み、歴史の中で新しいレコードを生成できます。 location.replace()を使用すると、履歴記録に新しいレコードが生成されなくなります。
| ハッシュ | "#コンテンツ" | 「」ではなく、URLでハッシュを返します |
| ホスト | 「www.google.com」 | サーバー名とポート番号を返します(ある場合) |
| ホスト名 | 「www.google.com」 | ポート番号なしでサーバー名を返します |
| href | 「www.google.com」 | 現在のページの完全なURLを返し、assign()を呼び出します |
| PathName | ''/wileycda/' | ディレクトリ名に戻ります |
| ポート | 「8080」 | ポート番号を返し、そうでない場合は、空の文字列を返します |
| プロトコル | 「HTTP:」 | ページで使用されるプロトコルに戻ります |
| 検索 | 「?= JavaScript」 | 質問マークから始めて、クエリ文字列を返します |
ナビゲーターオブジェクト:ブラウザを識別するために使用される事実上の標準であり、そのプロパティとメソッドは主にブラウザの種類を検出するために使用されます。
残りは、履歴オブジェクト(履歴レコードを保存)とスクリーンオブジェクト(クライアント機能を表示)のようなものです。 JSでのプログラミングはあまり効果的ではないため、繰り返しません。
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
DOM:
DOMは、XMLに基づいてHTMLに拡張されるAPIであり、Domは拡張するためにノードツリーに依存しています。
まず、ドキュメントノードが各ノードのルートノードであることを明確にする必要があります。ドキュメントノードには、1つの子ノード、つまりHTML(ドキュメント要素)のみがあります。
ノードタイプ:
DOM1のインターフェイスは、すべてのノードタイプ(テキストノード、属性ノード、要素ノード)によって実装され、このインターフェイスはJSのノードタイプとして実装されます。
各ノードが所有するnodeType属性。 12の数値値、要素 - 1、属性 - 2、テキスト - 3で示されています。
nodename属性、要素ノードノードの場合、nodenameの値はラベル名です。
nodevalue属性は、要素ノードノードの場合、nodevalueの値はnullです。
ノード関係:各ノードには、NodeList(クラス配列オブジェクト)オブジェクトを保存するChildNodes属性があります。各ノードには、親ノードを指すParentNodeプロパティがあります。チャイルドノードのノードは同じ親nodeを持っています。以前の訪問と次へのプロパティを使用して、兄弟ノードにアクセスします。同時に、ChildNodes [0] == FirstChild、ChildNodes [ChildNodes.Length-1] == lastChild。
操作ノード:appendChild()、ノードの最後にノードを押して、新しく追加されたノードを返します。 insertefore()、ノードをNodeList Header Unshiftに戻し、新しいノードを返します。交換(NewChild、TargetChild)は、ターゲットノードを交換します。元のノードはまだドキュメントにありますが、場所はありません。 RemoveChild(Tragetchild)はノードを削除すると、効果はchecheChild()に似ています。 CloneChild(Boolean)は、Trueの場合、完全な複製(ノード全体と子ノード全体)を意味します。Falseは基本的な複製を意味します。
ドキュメントタイプ:
ドキュメントを表すドキュメントオブジェクトは、htmldddocument(ドキュメントタイプから継承された)のインスタンスであり、HTMLページ全体を表します。同時に、倍数オブジェクトはウィンドウオブジェクトのプロパティでもあるため、グローバルオブジェクトとしてアクセスできます。 document.firstchild == html。 document.body == body。 document.doctype ---> <!doctype>への参照。 doucment.title ---> title document.url ---> location.url。
要素を見つける:getElementById()、getElementsByTagname()、getElementsByClassName()。
ドキュメントライティング:write()、writeeln()、open()、close()
要素タイプ:
getAttribute()、クラスの機能を取得し、classNameの代わりに「クラス」を使用し、element.classNameを使用するときにクラス属性を取得できます。
setAttribute()は、機能が存在する場合はその機能を設定します。それ以外の場合は、作成します。
Removeattribute()は、要素特性を完全に削除します。
CreateElement()、新しい要素を作成します。
テキストタイプ:
createTextNode()は、テキストノードを作成します。テキストノードが隣接するcompatriotノードに接続されている場合、2つのテキストはスペースなしで接続されます。
The above article's composition of JavaScript------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------