- ベストアンサー
静的 動的の違い
JavaScriptがPostBackしなくても画面を書き換えることができるのはなぜでしょうか。 また、静的ページと動的ページの違いはなんでしょうか。 http://neta.ywcafe.net/000436.html 上記のサイトを参考にしたのですが、単純にアクセスごとにページが変わるだけではないようですので。
- ShimantoGa
- お礼率94% (111/118)
- JavaScript
- 回答数4
- ありがとう数5
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
#3です。 > ご回答によると新規にテーブルができる、などであれば理解できるのですがクライアント側に存在しない画像を表示させることができるのでしょうか。 クライアント側にあってもサーバ側にあっても画像は表示できます。 - <img src='test.jpg' /> の要素ノードを追加すれば、ならサーバ - <img src='file:///C:/test.jpg' /> の要素ノードを追加すれば、ならローカル イメージとしては、現在のページにHTMLタグを表すノードを追加していると思って構いません。 Firebugをインストールすれば、イメージしやすいと思いますよ。 > であれば参考サイトのように更新することで広告が切り替わるだけのサイトは、入力値を書き換えているわけではないので静的ページであるということでしょうか。(回答者様の場合) 私はJavaScriptで生成するものは、全て動的だと思っています。 下記2つのHTMLをブラウザで表示してみてください。 ---- 静的ページ <html> <head><title>テスト</title></head> <body><p>静的ページだよ。</p></body> </html> ---- ---- 動的ページ <html> <head><title>テスト</title> <script type='text/javascript'> window.onload = function(){ // 「ページ読み込み終了後」にp要素ノードを挿入する var p = document.createElement('p'); p.appendChild(document.createTextNode('動的に生成したよ')); document.body.appendChild(p); } </script> </head> <body> <script type='text/javascript'> document.write("すぐに表示するよ"); // 「即座に」テキストを表示する </script> <!-- 「クリックしたら」、テキストノードを挿入する --> <p onclick='document.body.appendChild(document.createTextNode("クリックしたよ"));'> クリックしてね</p> </body> </html> ---- 静的ページは「読み込んだデータから順番に表示する」だけですが、 動的ページは「読み出されたコードを見て、コードが指示したとおりのタイミングで表示」します。 ご質問の広告表示も表示するタイミングはコードに依存していてこれは「動的に生成している」と言えるのではないでしょうか。 # document.write は静的っぽい命令ですが、今時こんな書き方をする人はあまりいません。 繰り返しになりますが、Firebugをインストールすれば生成されたノードを確認できますので、イメージがわかないようでしたら是非試してみてください。
その他の回答 (3)
- think49
- ベストアンサー率59% (285/482)
視点をどこに持っていくかで動的か否かの判断が分かれそうですね…。 以下、参考意見として受け取ってください。 > JavaScriptがPostBackしなくても画面を書き換えることができるのはなぜでしょうか。 ブラウザはノードという概念を持っていてJavaScriptはノードを書き換えるから、です。 第2回 ブラウザからHTMLはどう見えているかを理解しよう ～ドキュメントツリー～:ITpro http://itpro.nikkeibp.co.jp/article/COLUMN/20070627/276068/?ST=swd-tech Firefox拡張Firebugをインストールすると、[F12] キーでドキュメントツリーを確認できます。 コンソールで var p = document.createElement('p'); p.appendChild(document.createTextNode('Hello World!')); document.body.appendChild(p); を実行すると、FirebugのHTMLタブでp要素ノードが追加された事を確認できます。 > また、静的ページと動的ページの違いはなんでしょうか。 私は「入力値に応じて出力が変化するページ = 動的ページ」と理解しています。 http://www.google.co.jp/search?q=JavaScript はq=JavaScriptの値を変化させる事で出力が変化するので動的ページ。 JavaScriptも入力値を持っているので、基本的には動的だと思います。 「Web制作者が書いたコードの中で入力させる」か「onclickイベントなどでユーザに入力させる」などの細かな違いはありますが、 変化させるタイミングが一定していない性質もあるので動的と認識しています。 (静的ページは読み込みが終了したら全て表示されます)
お礼
ありがとうございます。 >ブラウザはノードという概念を持っていてJavaScriptはノードを書き換えるから、です。 ご回答によると新規にテーブルができる、などであれば理解できるのですがクライアント側に存在しない画像を表示させることができるのでしょうか。 例を挙げますと、とあるページ(どこかは忘れてしまいました)でボタンを押下するとPostBackなしに背景画像が書き変わるサイトがありました。 >私は「入力値に応じて出力が変化するページ = 動的ページ」と理解しています。 であれば参考サイトのように更新することで広告が切り替わるだけのサイトは、入力値を書き換えているわけではないので静的ページであるということでしょうか。(回答者様の場合) であれば私的にも理解しやすい定義のように思います。
- steel_gray
- ベストアンサー率66% (1052/1578)
どこかに正式な用語の辞書ってのがあって正解が決まっている問題では無いとは思いますが。 あるURLをサーバにリクエストした時、毎回同じ内容が返されれば静的、 毎回違う内容が返されれば動的、と分けられるんじゃないでしょうか。 例えば http://example.com/sample.html をリクエストの結果、得られるhtmlファイルが毎回同じかどうか、です。 リクエストのたびに変化するカウンターがimgで埋め込まれていたり、広告がjavascriptを通じて埋め込まれていても、html自体は同じなので静的。 （静的なページに動的なコンテンツが埋め込まれている、とでもいうのでしょうか。）
お礼
ありがとうございます。 >どこかに正式な用語の辞書ってのがあって正解が決まっている問題では無いとは思いますが。 それははじめて知りました。 プログラミングする上で非常によく目にする言葉なので何かしらの定義があるものと思っていました。 >html自体は同じなので静的。 ベースとなるページが書き変わらなければ静的。 今回の場合はベースとなるHTMLページにリクエストごとに変化する広告を乗っけているイメージですので、動的ではないという理解でよろしいでしょうか。
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
アクセスしたときに、「URLは同じだけどそこに書かれている内容はアクセスする条件に応じて変わる」物はすべて動的ページになります。 昔から言われている動的ページというのは、BBSなどが有名ですが、 アクセスカウンターや、広告が入っているページなども含まれます。 ブログやWikiなど、CGIを使っていても「URLが同じならそこに書かれている内容は常に同じ」であれば、 静的ページに分類されると思います。 （アクセスのたびに内容が変わる広告やブログパーツが入っていない場合） CGIもSSIも使っていなければURLが同じなら内容は変わらないため、静的ページになります。 （xreaやgeocitiesなどの無料ディスクスペースのホームページは、CGIと同じような機能を使った広告が入るため、動的ページです) AjaxやJSONPを使うと、最初にアクセスしたときは常に同じページですが、 その後、（読み込み完了のタイミングや、閲覧者がどこかのボタンなどをクリックしたタイミングなどで） URLが変わることなくページの内容が変わるので、「動的ページ」ですが、 JavaScriptを停止していると画面が変わらないので、 「JavaScriptを停止しているブラウザで見れば静的ページ、 JavaScriptを有効にしているブラウザで見れば動的ページ」 となると思います。 JavaScriptに対応していない検索ロボットからみれば、静的ページの分類になると思います。 > JavaScriptがPostBackしなくても画面を書き換えることができるのはなぜでしょうか。 AjaxだけがJavaScriptではありません。 参考にされているサイトは情報が古い気がします。 最近のGoogleロボットはある程度ではありますが、JavaScriptやAjaxにも対応している気がしますから。
お礼
ありがとうございます。 申し訳ありませんが、まだ完全に理解できておりません。 参考サイトにて、 アクセス毎に広告が変わるということは動的ページであると考えられなくも無いが正解は静的ページである。 とありますが、 >アクセスしたときに、「URLは同じだけどそこに書かれている内容はアクセスする条件に応じて変わる」物はすべて動的ページになります。 昔から言われている動的ページというのは、BBSなどが有名ですが、アクセスカウンターや、広告が入っているページなども含まれます。 というご回答と矛盾はしないのでしょうか？ 参考サイトが古いとのことですので、サイトのほうが間違っているということでしょうか。
お礼
ありがとうございます。 Firebugを導入したところ、タグが動的に生成されているところを確認できました。 IEブラウザのソース表示では見えなかったので驚きました。 その意味で言えば先のdocument.writeは「すぐに表示するよ」を生成し、document.createTextNodeは「クリックしたよ」を生成しているので動的。 逆に、 <html> <head> <title>Webサイト</title> <script type="text/javascript"> <!-- function disp(){ if(window.confirm('Yes or No ?')){ location.href = "遷移先.html"; } else{ window.alert('キャンセルされました'); } } // --> </script> </head> <body> <p><input type="button" value="確認ダイアログ" onClick="disp()"></p> </body> は何も生成しないので静的ということになりますね。