スピーカ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になります その時点で。 それでは、どのように修正するには? まあ我々は解決策がいくつかあります。 しかし、ここでは再配置する最も簡単なを試してみましょう 頭から私のスクリプトタグ に向けて、特に私の体にタグを付けますが、 だから私のページの本体の底部 それは、ノードの下だと と質問。 具体的には、のはハイライトしてカットしましょう スクリプトの開始タグと終了タグ そのコードブロック全体を再配置 ここにファイルの最後に。 さて、これは必ずしもクリーンではありません デザインが、少なくともそれは意志 操作の正しい順序を強制する。 それでは、ファイルを保存してみましょうと、 私のブラウザに再ロードします。 のページをリロードしましょう​​、再入力私の名前、 そここんにちは、デビッドが帰ってきた。