HTMLがJavascriptより先です。だから、HTMLはJSコードが読み書きできるオブジェクトのツリーとしてJavascriptに公開されています。
これは、Webサイト(JQuery時代)に人生を送る古い方法は、既存のHTMLページの上にJSコードのレイヤーを実行することにあります。 JSプログラムは、ユーザイベントに応じてページのインタラクティブな部分を見つけ、コードを添付します。 JSコードは、ページの可動部分を見つけて、それらを完了または更新する。
しかし、このようにJSアプリケーションを作成すると、メンテナンスと改善が難しくなります。 HTMLでの変更(ページ間のボタンの移動、リストの表への切り替え、数値の別の表示の追加など)を行うと、HTMLの処理を担当するJSコードが古くなり、しばしば壊れた。また、ページが間違ってしまった場合、画面上に表示されているものがJSコードであるかどうかを簡単に追跡する方法はありません。
あなたはそれについて二度考える場合は、複雑なアプリケーションを開発する際にJSとHTMLの関係を逆にしたいです。ミドルウェアのテンプレート化/バインドの目的はこれです。彼らは、JSとHTMLの関係を逆転させて、JS Objectがユーザインタフェースを構築するための基本レイヤになるようにします。今HTMLページはJavascriptの上で実行されている実際のプログラムと同じように動作するように
角度またはノックアウトのようなライブラリーのようなフレームワーク、ディレクティブでHTMLを豊かにします。 Javascriptレイヤーはアプリケーションロジックにのみ電力を供給し、ユーザーインターフェイスの仕方には依存しません。ボタンを移動したり、何かを別のものに置き換えたり、ページを2つに分割したりするなどしても、途切れることはありません。
テンプレート化は、このアプローチの最初のステップです。 JS変数の名前をHtmlに直接入れることです。テンプレートエンジンは、テンプレートが実行されるときに、これらの変数をその値に置き換えます。
しかし、テンプレートでは不十分です。表示された変数が変更された場合でも、テンプレートの実行を手動でコーディングする必要があります。これはプログラマの仕事の中で最も悪い部分です。ページコンポーネントを変更したり、これらのイベントにバインディングを手動で追加してコンポーネントを更新したりする可能性のあるすべてのイベントを追跡します。
本当に双方向のデータバインディングミドルウェアは、テンプレートエンジンよりもはるかに優れています。最初はテンプレートエンジンのように機能しますが、置換されたすべての変数や式も追跡し、値が変更されるとすぐにHTMLドキュメントをautoMAGICallyに更新します。また、ユーザーがフォームフィールドなどを編集したときに、JS変数の変更を「魔法のように」適用することもできます。
Excelスプレッドシートに数値を入力すると、近くの式が自動的に更新されるのとまったく同じです。 Excel式は、「宣言的結合」の一形態です。数式結果を更新するためのコードを書く必要はありません.Excelは面倒な作業です。
Real Life(tm)では、変化するアプリケーションのビューレイヤーがロジックレイヤーの10倍以上変更されます(銀行のWebサイトについて考える)。だから、あなたのJSロジックのすべてを壊すことなくページレイアウトを改良できることは、Web開発者の幸福です。