• ベストアンサー

HTMLの全頁共通メニューをjsファイルでつくってしまうのは問題ないか

HTML30ページほどのサイトを作っています。 30ページに共通して表示させるGNB(リンクメニュー)があり、それをjavascript1ファイルでもって各HTMLより呼び出したいと思っています。 また、リンクとなるGNBの数はページ数の数だけあるので、今見ているページがどのメニューかわかるようにしたいと思っています。 ■aページを見ている場合 [a] b c d ■bページを見ている場合 a [b] c d e そこで、javascriptで呼び出し元HTMLファイル名を取得(location.hrefから、最終"/"までのパスを削除)し、 30個のif文を作成して判断し、表示させようと思うのですが、このやり方はどうなのでしょうか? javascriptオフの人用に「javascriptを使っています」という文章は表示するつもりですが、速度とブラウザ対応状況が気になります。 HTMLに埋め込んでいる状態と30個のifをかませるjavascript表示でそれほど速度差はないのでしょうか? 最近のブラウザ(IE6/IE7/FIREFOX3/SAFARI3)は保証したいと思うのですが問題ないでしょうか? 上記2点プラスアルファを考慮して、するべきかしないべきか。ご回答またはアドバイスをお願いいたします。

noname#102084
noname#102084

質問者が選んだベストアンサー

  • ベストアンサー
  • SAYKA
  • ベストアンサー率34% (944/2776)
回答No.1

全然アリな手法だよ ただ、懸念通り、やり方がブラウザによって違うから常に検証しないといけなくなるね。 慣れてくるとこれはこのブラウザではだめだとか、どのブラウザでも動く関数を作ったりとかするようになるよ 最近、そういうクロスブラウザライブラリが増えてきてるから探してみるのも良いかもね。

noname#102084
質問者

お礼

回答ありがとうございます。 あまり相談する人がいなかったので、実現に向けたアドバイスをいただけてほっとしました。 ブラウザは全部自分でみてみようと思います。

その他の回答 (1)

  • dyna_1550
  • ベストアンサー率34% (122/353)
回答No.2

共通部分はメニューということなので頻繁に更新されることはない、と 考えてよいでしょうか。 あくまで経験上の話で技術的な裏付けはないのですが、JavaScriptの外部ファイルは ブラウザにキャッシュされ、更新タイミングがよくわかりません。 ブラウザのリロードなどでは更新されなかったりして、デバッグの時に悩 まされることがありました。 そんなときは手っ取り早く、.jsファイルのファイル名を変えて対処しました。 当然、呼び出し側のHTMLの書換も必要です。 もし、perlかphpが使えるサーバであれば、共通部分を読み込むスクリプト を利用することをお勧めします。 ベタベタな方法としては、30のHTMLの共通部分に特定の文字列を 書いておいて、エディタで置換するなど。 ブラウザのキャッシュなんて気にしない、ということであれば この限りではありません。

noname#102084
質問者

お礼

回答ありがとうございます。 >もし、perlかphpが使えるサーバであれば たしかにCGIの方がサーバー側処理で確実だと思いますが、今回は環境と簡易にという点でjavascriptで実現することにしました。 キャッシュの件もアドバイスありがとうございます。 問い合わせ等があった時のために頭にいれておきます。

関連するQ&A

  • ページ毎に共通のメニューを表示したい。

    複数あるページからそれぞれ違うメニューを表示させたいです。 ページもメニューの種類も大量にあるため、メニューはjavascript内などに 記述して、共通のコードを読むようにしたいです。 [メニューA] ・menuA-1 ・menuA-2 ・menuA-3 [メニューB] ・menuB-1 ・menuB-2 ・menuB-3 [メニューC] (以下略) メニューがA~の数種類あるとして、 page1.html→メニュAを表示 page2.html→メニュBを表示 page3.html→メニュAを表示 page4.html→メニュBを表示 page5.html→メニュCを表示  ・  ・  ・ …という風にしたい。 <body class=・・・>でページ毎に名前を付け、 javascript内で条件分岐にて選択しようとしたのですが、記述の仕方が わかりませんでした。 メニューが増えた際になるべく効率よく修正できるようにしたいです。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • HTML,js)リンクを新しいタブで移動しない

    お世話になります。 HTMLあるいはjavascriptに関する質問です。 普通は、targetユーザーがリンクをクリックしたら、リンク先のページが新しいウィンドウまたはタブで開き、ブラウザが新しいページに移動しますよね? これをちょっと変えて、リンク先のページが新しいウィンドウで開き、ブラウザがリンク元のページに留まるようにしたいのですが、これをサイト側がコントロールすることはできるのでしょうか? ユーザーには、リンク先をクリックして、リンク先のページを見てほしいのですが、後でそれをしてほしいのです。今は、私のページを最後まで見てほしいというのが願いです。

    • 締切済み
    • CSS
  • 【JavaScript?HTML?】Webページで

    【JavaScript?HTML?】Webページでこのページは戻ることは出来ませんと表示されました。 どうやったら、Webブラウザの戻るボタンを無効に出来るのですか?

  • セレクトメニューがIE/FFで違う動作 ソース有

    セレクトメニューの動作が、IE/Firefox(IE以外のブラウザ)で違う(ソース付き) 皆さん、よろしくお願いします。 全く同じ数十のhtmlファイルがあります。 そこで、共通のセレクトメニューを使っています。 ファイル名によって表示項目を変えています。 IEでは、B.HTMLを起動すると、B.HTMLがメニュー項目に出ます。 ただ、FirefoxだとB.HTMLを起動すると、A.HTMLがメニュー項目に出てしまいます。 A.HTMLは両方とも正しく出ます。 どのブラウザでも、IEと同じ動作をさせるには、どのようにすればよろしいでしょうか? ●制限 B.HTMLのOPTIONにselectedを加えるという事は、全ファイル同じ内容である必要があるので、できないのです。 PHPなどでなく、javascriptで実現したいと思っております。 Firefox(IE以外のブラウザ)のjavascriptは有効になっています。 下記を、A.HTML、B.HTMLというファイルに保存すればそのまま動作します。 ================================================ <html> <head> <SCRIPT type="text/javascript"> function selectChange() { var sURL = document.URL.toUpperCase(); if (sURL.indexOf("A.HTML") != -1) Prog.selectedIndex = 0; else if (sURL.indexOf("B.HTML") != -1) Prog.selectedIndex = 1; } </script> </head> <body onLoad="selectChange()"> <select onChange="location.href=this.options[this.selectedIndex].value" name="Prog" size="1"> <OPTION value="A.HTML">A.HTML</OPTION> <OPTION value="B.HTML">B.HTML</OPTION> </select> </body> </html> ================================================

  • メニューバーなしのHTMLページの作り方を教えて

    どなたかご存知でしたら教えてください。 配布用CDを作るのに、これまでAutorunするフォームを作成できるフリーソフトを使っていましたたが、これが、Windows7で動かないことが分かりましたので、次のCDでは、HTMLのページをAutoで開くようにしたいと思っています。 そこで、質問なのですが、指定サイズのメニューバーのないページの作り方をご存じないでしょうか?できれば、ブラウザの種類を問わずに、同じように動いて、できればマックOSでも同様になると有難いと思っています。 Javascriptで、可能性があるように思い、サイズ指定などのサンプルを真似て貼り付けたことがありますがダメでした。巧くいきそうでも、CDやHDのJavascriptを開くとブラウザでブロックされるようで、配布用CDではこれをスルーで着なければいけないと思っています。これも、<!-- saved from url=(0013)about:internet -->なるサンプルを貼り付けるとスルーすると呼んだのですが、使い方が分かりません。 是非、教えてください。よろしくお願いします。

  • ページ左にプルダウンメニューをつけたいです。

    ページ左にプルダウンメニューをつけたいです。 ページ数がとても多く、目次だけですごい量になってしまうので、 何とか苦なく見られるようにプルダウン式にできればと思っています たとえば、下記のように普段表示されていて、 Aについて Bについて Cについて 「Aについて」をクリックすると下記のようにAの中の 各ページへのリンクが現れるようにしたいです。 Aについて  ・あいうえお  ・かきくけこ  ・さしすせそ Bについて Cについて こういったプログラムを紹介してくれているページがあれば 教えていただけますでしょうか。 よろしくお願いいたします!

  • HTML+フレーム構成のページを、HTML+CSSで書き換えるには?

    HTML+フレーム構成のページを、HTML+CSSで書き換えるには? コンテンツはそのままに、HTML+フレーム構成のページを、HTML+CSSで書き換えることになりました。 ヘッダー、フッター、上部に画像ロゴ、左にメニューを配置したいと思ってます。 メインコンテンツ部分以外はSSIでインクルードしたいと思っています。 案外簡単だと思ったのですが・・・すぐ配置が崩れて悩んでます。 さらに、CromeとIEで確認をするたびに配置が違ってしまいます。 merginとpadsdingを0にしてから始めるらしいことまでは調べたのですが、 そうするととても配置が変で面倒になります。 現在はFFFTPと秀丸とブラウザで作業してます。 ほかに、PhotoShop6とホームページビルダー14とMicrosoftExpressionweb3は手元にライセンスがあります。 HTMLは分かりますが、CSSは初めてです。多少がんばれば、javaScriptも使えるかもしれません。 お薦めの本や、作り方、フリーウェアなどありましたらご指導ください。よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • ウエブページのHTMLタグを見れない

    ウエブページのHTMLタグを表示させたいんですが出来ません。どうしてでしょうか? 操作はメニュー→表示→ソースを選択で、出るらしいんですが、自分のは何も起こりません。ブラウザはインターネットエクスプローラーを使用してます。ちょっといそいでます。よろしくお願いします。

  • 保存したHTMLファイルを開くと固まる

    こんにちは、よろしくお願い致します。 Windows7 Professional SP1 です。 IE9からIE10にアップグレードをしました。 Amazonのお気に入りの商品のページをDドライブ内に保存して、 その保存したHTMLファイルを開くと、固まってしまいました。 「Webページが応答しません」と表示されます。他の開いているページ(タブ)は固まっていません。 Cドライブ内に保存した場合は、正しく開くことができます。 IE9のときにはDドライブ内に保存しても正しく開けていましたし、 IE9のときに保存したHTMLファイルを、現在IE10で開いても正しく開くことができます。 原因が判る方、いらっしゃいますでしょうか。 よろしくお願い致します。

  • フレームページをHTMLで1枚に

    現在フレームページをHTML1枚に変更しようと思っているのですが、この場合どういったjavascriptを使用すればいいのでしょうか? ちなみに作ろうとしているのは左右でmenuとmainで分けmenu部分でmainの内容を変更していきたいのですが。