- 締切済み
外部javascriptファイルの中にさらに外部javascriptファイルを入れたい
javascript初心者です。 メニューの一部を外部ファイルによるツリーメニューにし、 さらにメニュー部分全体を外部ファイルにしようとしましたが、 メニュー部分全体を外部ファイルに移したら、 中のツリーメニューが機能しなくなってしまいました。 いろいろ試してみましたが、付け焼き刃の知識では皆目見当が付きません。 ご指摘いただけると嬉しいです。内容は下記の通りです。 メニュー全体の外部ファイル「menu.js」 document.write('<div id="menu">'); document.write('<h1>お役立ち情報<\/h1>'); document.write('<ul>'); document.write('<script src="javascript\/tree.js" type="text\/javascript"><\/script>'); document.write('<li><a href="javascript:tree("click1");" title="">HOME<\/a>'); document.write('<\/li>'); document.write('<div id="click1" style="display:none;">'); document.write(' <a href="未設定" title="作成中です" target="未定">第1ページ <\/a>'); document.write('<br>'); document.write(' <a href="未設定" title="教えられません" target="未定">第2ページ <\/a>'); document.write('<br>'); document.write('<\/div>'); document.write('<li><a href="javascript:tree("click2");" title="">お知らせ<\/a>'); document.write('<\/li>'); document.write('<div id="click2" style="display:none;">'); document.write(' <a href="未設定" title="作成中です" target="未定">第3ページ <\/a>'); document.write('<br>'); document.write(' <a href="未設定" title="教えられません" target="未定">第4ページ <\/a>'); document.write('<br>'); document.write('<\/div>'); document.write('<li><a href="#">DOWNLOAD<\/a>'); document.write('<\/li>'); document.write('<\/ul>'); document.write('<\/div>'); 中に入れてあるツリーメニューの外部ファイル「tree.js」 function tree(id) { if (document.getElementById(id).style.display == "block") document.getElementById(id).style.display="none"; else document.getElementById(id).style.display="block"; } .htmlの記述はこうなっています。 <script src="menu.js" type="text/javascript"></script>
- みんなの回答 (3)
- 専門家の回答
みんなの回答
- t_netbug
- ベストアンサー率34% (15/44)
書き込みしたはずなのに反映されてないので再度投稿。 二重投稿になってたらごめんなさい。 <html> <head> <title>sample</title> <script type="text/javascript"> window.onload = function () { var header = document.getElementsByTagName('head')(0); var script = document.createElement('script'); script.src = "xxxxxx.js"; script.type = "text/javascript"; header.appendChild(script); alert(header.innerHTML); //デバッグ用(動作チェック必要なければ消して) } </script> </head> <body> </body> </html> ちなみにwindow.onloadイベントでなくても問題なく動作するようです。 自分のやりたい状況に応じて変更してみてください。
- t_netbug
- ベストアンサー率34% (15/44)
<html> <head> <title>sample</title> <script type="text/javascript"> window.onload = function () { var header = document.getElementsByTagName('head')(0); var script = document.createElement('script'); script.src = "xxxxxx.js"; script.type = "text/javascript"; header.appendChild(script); alert(header.innerHTML); //デバッグ用(動作チェック必要なければ消して) } </script> </head> <body> </body> </html> ちなみにwindow.onloadイベントでなくても問題なく動作するようです。 自分のやりたい状況に応じて変更してみてください。
- fujillin
- ベストアンサー率61% (1594/2576)
ダイナミックなソースならいざ知らず、単なるテキストをスクリプトでわざわざ書き出している理由が不明ですが・・・ htmlにbodyタグをいれておいて、表示後に、アドレスウインドウで以下をダイレクトに入力してリターンしてみてください。 アラートで、出力されたマークアップが表示されるはずですので、よ~く確認してみれば発見できると思います。 javascript:alert(document.getElementsByTagName('body')[0].innerHTML); どうもブラウザによっても少し結果が違うみたいですが・・・ jsファイルもわざわざ2つに分けなくても、menu.jsにまとめることも可能なように見えるけど。 なんだか、わざわざわかりにくくしていて、結局のところ、作っているご自身(質問者さん)にもわからないものになっちゃっているだけでは?
お礼
ありがとうございます。早速試してみますね。 メニュー部分をjavascriptにしたいのには訳があり、今HPのリニューアルを行っているのですが、ページが何百ページもあること。またツリーメニューの下の階層にある部分が増えたり減ったりする可能性があるので、もしそうなった場合全てのページを直さなくてはいけなくなるからです。 因みにフレームはSEO対策のため使いたくありません。 それから、tree.jsの中身をmenu.jsに入れて一つのファイルにしたら、メニュー自体が何も写らなくなってしまったので、分けてみました。
お礼
ありがとうございます。早速試してみますね。