0

私はJavascriptの世界が初めてで、Angular.JSをやっています。ng-controller を使用して変数に「Hello World」を割り当て、HTML で値をバインドする単純な hello world コードを作成しました。

    <div ng-controller="Controller">{{DisplayData}}</div>

私のコントローラーは

function Controller($scope) { $scope.DisplayData = "Hello World"; }

コードを実行すると、期待どおりに「Hello World」が正しく表示されます。好奇心から、コード ビハインドをチェックして、div 内に「Hello World」があることを期待していましたが、代わりに、Angular ディレクティブを含む HTML コードが表示されました。http://docs.angularjs.org/guide/concepts#startup
のドキュメントを読んで、なぜそれを行っているのかがわかると期待していますが、理解したかどうかはよくわかりません。 ここに私の質問があります。HTML は静的であり、ブラウザーは HTML をそのままレンダリングすると考えていました。したがって、動的なものを作成する必要がある場合は、最終的な DOM オブジェクトを作成する前に、値を評価し、Java スクリプトを使用して実際の値に置き換えます。理解が間違っていますか？

4

2 に答える 2

4

JavaScript を使用して HTML ページを変更する場合、実際にはページのコードを変更するのではなく、DOM と呼ばれるものを変更します。DOM はメモリ内にあり、コード ビハインドを読み取ることによって最初に作成されます。View Page Source などで表示されるのは、ブラウザがサーバーから取得した元のコードです。ほとんどのブラウザーには、DOM をテキスト形式で表示するためのツールがあります。たとえば、Chrome で F12 を押すと、開発ツールが表示されます。これにより、JavaScript 操作の結果が表示されます。

于 2013-03-29T17:41:39.870 に答える
1

Javascript フレームワークを使用してページを操作する場合、これは DOM または HTML がロードされた後に発生するため、ビュー ソースに表示される DOM はサーバーからのもののままです。Chrome と「Inspect Element」を使用している場合は、Hello World で最新の html が表示されます。

于 2013-03-29T17:40:06.987 に答える