>> スピーカ1：今では最後の例では、 我々はいくつかの散在リコール
私のHTMLの内側のJavaScriptコード、 具体的には、値の内部
送信時に呼ばれる属性 そのフォームタグの。
今の小ページの場合、この このような大したことではありません。
しかし、ウェブページとして長くなり、より 複雑な、単にあなたを置く
内部のあちこちでのJavaScriptコード 属性の値ではないの
最高のデザイン。
最高の我々はそれを考慮している場合 少なくともの中に置く
中央でスクリプトタグ。
>> これを行うには？
さてそれでは、私のformタグに戻るまで放置し、 最初にこの属性を削除し、その
完全に大切にしています。
そして、ここまでではなく、定義 グリート呼び出された関数は、の上でハングアップしましょう
最終的に我々のコードの行に まだ実行して置き換えることになるでしょう
次のようにグリート機能。
Document.get要素によってID 引用終わりデモを引用 -
デモ、リコールは、独特です フォーム自体の識別子 -
名であるリコール、提出にドット イベントハンドラの
我々は興味を持っている。
とのハンドラを提出することに割り当てることができ 実際の値
自身を機能します。
>> 今、私は実際にはいないことに注意してください ここで関数を呼び出す。
私の代わりに、匿名の定義だけど、 さもなければラムダ関数として知られ、
これらの中括弧の間指定することにより、 そのするコードの束
実際に実行される。
具体的には、私はしたいコード 実行するためには、私が持っていたラインです
前、次に者がそれに追加してみましょう このフォームではありませんようにfalseを返す
最終的にはリモートWebを終了するために提出した 伝統的な方法でサーバ。
>> それでは、このファイルを保存、それを開いてみましょう ブラウザで、何が起こるかを参照してください。
http://localhost/dom-1.html。
それでは私の名前を入力してみましょう、 ダビデは、提出してください。
そして、何が起こっているように見えません 私のページのURLには思わ除く
フォームがあったかのように変更されました 実際に同じファイルを提出した。
>> さて、なぜそれがあるかもしれない？
さて私はいくつかのより多くの情報が必要です。
それでは、先に行くと、Chromeのを開いてみましょう 開発者ツール、私が実際にできるように、
見るためにコンソールウィンドウを見て 私が何か間違ったことをやった場合には。
私はその経由でアクセスすることができます いくつかの方法。
の一つは、ここで、このメニューを介して行われる [ツール]の下で、その後にダウン
開発者ツール。
>> そして、ここで[コンソール]タブで予告 キャッチされていないタイプのエラーは、存在しないことができます
ヌルのSubmitにプロパティを設定します。
さて、なぜそれがあるかもしれない？
さてここに戻って自分のソースコード、予告中 その上で、私はあると思い提出
要素のプロパティ 一意の識別子はデモです。
要素は、再び、わずかである ツリーのノード。
>> だから、私のブラウザにはないように思われる その要素と思う
またはノードがまだ存在しています。
そして実際、それはしていません。
Webページが解析されることを思い出してか、読み Webブラウザによる、上から下へ、
左から右へ。
そしてそうJavaScriptコードの場合 遭遇し、典型的には、それが実行されるのは
すぐに。
>> しかし、今回のケースでは、私たちももらっていない まだDOMの一部と、
ユニークで形成する、HTML、 識別子デモは宣言されています。
そして私たちは、私が実行しようとしている でも、そのノードの前のJavaScriptコード
もちろん、あるツリーに存在する 問題のある、そして、確かに理由
要素自体はnullになります その時点で。
>> それでは、どのように修正するには？
まあ我々は解決策がいくつかあります。
しかし、ここでは再配置する最も簡単なを試してみましょう 頭から私のスクリプトタグ
に向けて、特に私の体にタグを付けますが、 だから私のページの本体の底部
それは、ノードの下だと と質問。
具体的には、のはハイライトしてカットしましょう スクリプトの開始タグと終了タグ
そのコードブロック全体を再配置 ここにファイルの最後に。
>> さて、これは必ずしもクリーンではありません デザインが、少なくともそれは意志
操作の正しい順序を強制する。
それでは、ファイルを保存してみましょうと、 私のブラウザに再ロードします。
のページをリロードしましょう​​、再入力私の名前、 そここんにちは、デビッドが帰ってきた。