• 締切済み

外部 .js で

index.html 内の head タグ間に <script type="text/javascript" src="./js/test2.js"></script> また、index.html と同階層にある js ディレクトリの内の test2.js の内容は document.write("test") だけです。 この条件で(というのは、最終的に別にテキストを出したいだけというわけではないので)、body の任意の場所に test を表示 [記述] させる方法を教えてください。 body の適当な場所に <script type="text/javascript"></script> と書いても、何も現れません(ソースで確かめています)。根本的におかしいのかもしれませんが、わかりません。 必ず、これら条件でお願いします。

  • -ROM
  • お礼率19% (78/407)

みんなの回答

  • gaku1
  • ベストアンサー率71% (10/14)
回答No.5

No.4です。No.4ではトンチンカンなことを書いてしまったようです。書き直します。  まず,外部.jsで関数を定義します。 function aaa(){ var sss=document.getElement.ById("bbb"); sss.innerHTML="TEST"; }  つぎに,htmlからこの関数を次のようにして呼ぶようにします。 <body onload="aaa()">  最後に,bodyの好きなところに, <span id="bbb"></span> と書きます。ページが表示されると,<span...>の位置にTEXTと表示されるはずです。onloadハンドラで関数を呼ぶのは,idが定義されたあとに関数をよぶためです。  と,こんな感じではどうでしょうか。

-ROM
質問者

補足

最初に書いてあるような条件で実現したいのです。 できないなら JavaScript の使用そのものをやめて、大幅に設計変更しよ%鑮

  • gaku1
  • ベストアンサー率71% (10/14)
回答No.4

外部の.jsではdocument.write()を関数に包み(たとえば,function aaa(){document.write("test");}),body内から<script>aaa();</script>とするのではいけないのでしょうか。

  • Werner
  • ベストアンサー率53% (395/735)
回答No.3

> インラインでできますが、そういうことはしたくないのです。 インラインは、HTML文書内に  <script type="text/javascript">document.write("test");</script> のように、直接JavaScriptを記述するという意味ですよね? それなら、私の提示したHTML文書はJavaScriptを外部ファイルにしか記述していないはずですが。 (「直接document.writeを記述しても…」と書いたのは、あくまで動作確認のためです。) それとも、bodyにscript要素さえ記述したくないのでしょうか? 最初の質問文に、 > body の適当な場所に <script type="text/javascript"></script> と書いても とあるので、bodyにscript要素を書くのはかまわないと解釈したのですが。 それに、bodyのtestを表示したい場所にscript要素を記述しないと、 表示する場所を指定できませんよ。 (もし、bodyにscript要素も書きたくないのであれば、 document.writeではなくinnerHTMLなどを使った方が良さそうです。) あと、script要素内に直接document.writeを記述したときや、 私が#2で示したHTMLを使ったときは結局動作したのでしょうか?しなかったのでしょうか? > 「意義=結果をもたらすのですか」という意味です; すなわち、正しい記述なのかということです script は headにもbodyにも記述できます。なので正しい記述です。

  • Werner
  • ベストアンサー率53% (395/735)
回答No.2

> UA のソースでも確認しています; <script type="text/javascript" src="./js/test2.js"></script> が表示されているだけです HTMLのソースを見ても、JavaScriptの出力結果を確認することはできないですよ。 でも、UAのレンダリング結果にも反映されないとしたら変ですね。 試しに、外部jsファイルを使わずに直接document.writeを記述しても表示されませんか? 私の方でも試して見ましたが、 以下の内容でtestが表示されました。 (IE 6.0/Firefox 1.5.0.6/Opera9.01で確認) ------------------------------------ <html> <head> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>test</title> </head> <body> <script type="text/javascript" src="./js/test2.js"></script> </body> </html> ------------------------------------ > そもそも思ったのですが、<script> は body に書いて意味あるものなのですか。 今回の場合はdocument.writeでbodyに出力するのが目的なのでbodyで良いでしょう。 外部jsを使わずにdocument.writeを記述するときはbody内に書きませんでしたか? (私はdocument.writeは使わないこともあって全部headに書いてますが。)

-ROM
質問者

補足

UA で確認できるのは、レンダリングの結果です。 インラインでできますが、そういうことはしたくないのです。最初の質問に念押ししているので、ご覧ください。 「意味あるのですか」というのは、「意義=結果をもたらすのですか」という意味です; すなわち、正しい記述なのかということです; 動くJavaScript は、head にしか書いたことがありません。

  • Werner
  • ベストアンサー率53% (395/735)
回答No.1

外部jsファイルに書かれているのがfunction定義などなら jsファイルはheadで指定すればよいのですが、 > index.html 内の head タグ間に > <script type="text/javascript" src="./js/test2.js"></script> この場合、head要素内に <script type="text/javascript"> document.write("test"); </script> と書いたのと同じ事になってしまいます。 これは質問者さんの意図とは違うのではないでしょうか? (試してみたら、head要素内の文字も一応表示はされましたが。) > body の適当な場所に <script type="text/javascript"></script> と書いても、何も現れません script要素内に何もかかれておらず、srcも指定されていないので、 それだと空の何もしないJavaScriptを書いたことになります。 そのbodyの方に <script type="text/javascript" src="./js/test2.js"></script> と書いてみてはどうでしょう。

-ROM
質問者

補足

それもやってみたのですが、駄目でした。何も表示されていません(UA のソースでも確認しています; <script type="text/javascript" src="./js/test2.js"></script> が表示されているだけです)。 私のやりたいことは、「外部 .js に document.write("test") とだけ書いて、HTML のインラインには関数も何も一切書かず、HTML の body の任意の場所に test を表示させる」というものです。 そもそも思ったのですが、<script> は body に書いて意味あるものなのですか。

関連するQ&A

  • 外部JSファイルが読み込まない。

    javascriptの勉強をし始めて、二日目の初心者です。 jsファイルを使って、画像をIEで表示させたいのですが、上手く読み込んでくれません。 どうか、教えてください。 ---html----------------------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4,01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="common.js" type=text/javascript" charset="UTF-8"> </script> <script src="showImage2.js" type="text/javascript" charset="UTF-8"> </script> <title>キャラクターの表示</title> </head> <body onlaod="main()"> <noscript>JavaScriptを有効にしてください</noscript> </body> </html> ----js------------------------------------------------------------------------------ var img; function main() { img=document.createElement("img") document.body.appendChild(img); img.src="pcStay.png"; } ------------------------------------------------------------------------------------

  • jQuery.jsを使ったhtml外部読み込み

    教えてください。 現在Jqueryを使用して外部htmlを読み込ませようとしていますが、 うまくいきません・・・ ■本体html <head> <script src="js/jquery-1.8.3.min.js"></script> </head> <body> <script type="text/javascript" src="sample.js"></scrip> <div id="sample"></div> </body> ■sample.js // JavaScript Document $(function(){ $("#sample").load("sample.html"); }); ■読み込ませるsample.html 特に設定なし このような感じですが、全然読み込めません。。。 javascriptを外部リンクにしているのは、読み込むhtmlが複数ある為、 headの見栄えが悪くなるからという個人的な意見です・・・ 済みませんがお知恵をお貸しください!!

  • JSP内で外部jsファイルを指定する

    昨日から散々悩んでいます。 tomcatのJSPから外部jsファイルが読み込めません。 最初htmlのみでテストしたのですが そのときは何の問題も無く動きました。 URLの指定の仕方かなと思いましたが、 cssのほうは同じ指定の仕方で効いています。 <!---------- JSP内容 ------------------------> <!-- [テスト]ボタン押下でscript実行 --> <html> <head> <title>テスト</title> <script Language='JavaScript'    type='text/javascript' charset="shift_jis" src='/Test/script/Script.js'> </script> <script language='JavaScript' type='text/javascript'> <!-- function test(){ jstest(); } function test1(){ alert("test1:OK"); } // --> </script> <link rel="stylesheet" href="/Test/css/Style_ver1.css" type="text/css"> </head> <body> <form> <input type='button' class="button" value='テスト' onclick="test()"> </form> </body> </html> <!---------- 外部js内容------------------------> function jstest(){ alert("jstest:OK"); } <!---------------------------------------------> onclick="test1()"にすると動きます。 以前に作られた別アプリケーションのJ2EEのソースを見ると、 src=<c:url とcoreタグが使用されています。 coreタグの使用なしにURLを書くことはできないのでしょうか? すいませんが、どなたか教えてください。 宜しくお願いします。

    • ベストアンサー
    • Java
  • 複数の外部jsをランダム表示させたい

    1つのhtmlの中で <script type="text/javascript" src="001.js"></script> <script type="text/javascript" src="002.js"></script> <script type="text/javascript" src="003.js"></script> といった複数のjsをランダムで表示させるコードや、サンプル掲載サイトを教えていただけませんか? 各jsの中身はテキストや画像などHTMLに表示されるものになっています。 よくあるランダムバナーやランダムリンクのjs版という感じです。 画像やテキストのランダムスクリプトを使って、呼び出される部分に当たるところを上記のようなjsに変えてみたりもしたのですが、IEやOperaではOKでしたがFirefoxではエラーになってしまったり、表示されなくなったりして上手くいきませんでした…;; よろしくお願いいたします。

  • 外部スクリプトでどうしてもエラーが出ちゃう!

    こんにちわ。 早速なんですが、外部スクリプトに文章を入れてhtmlに記述したスクリプトでその文章を読み出そうとしてるんですが、 つまり外部スクリプト(ファイル名:test.js)の中は abc="あ~テストテストってこんな感じに書いて"; des="<FONT size="-1">にこめのテスト</FONT>"; って書いてhtmlの中に書くスクリプトは <html> <head><SCRIPT src="test.js"type="text/javascript"language="javascript"></SCRIPT> </head> <body> <SCRIPT type="text/javascript"> <!-- document.write(abc); // --> </SCRIPT> <SCRIPT type="text/javascript"> <!-- document.write(des); // --> </SCRIPT> </body> </html> って感じなんですが、これを開くと エラー';'がありません。 エラー'abc'は宣言されていません エラー'des'は宣言されていません ってでくるんです。もちろん、test.jsへのパスはあってます。 何か書き方が違っていましたら教えてください。

  • IE8で外部jsファイルが読み込めない

    htmlでjavascriptを使用しようとhtmlファイルとjsファイルを同階層に置き、下記のように外部jsファイルを読み込んでいます。 <script type="text/javascript" src="./com.js"></script> しかし、IE8でそのhtmlを開くと 「メッセージ: 文字が正しくありません。ライン: 1文字: 1コード: 0 URI: file:///C:/Users/PCUser/Desktop/test/common/js/com.js」 というエラーが発生してjavascriptが読み込めません。 秀丸でsrc="./com.js"をクリックするとソースが表示されるのでパスは間違えていないと思います。 また、簡単なボタン押下時にalertを表示するscriptを作成して確認したところ、FIRE FOXでは正常に動きましたが、IE8ではやはり動きませんでした。 文字コードはhtml、javascript共にshift-jisです。 他にjavascriptを読み込めない原因は何かありますでしょうか? よろしくお願いいたします。

  • 外部ファイルの記述の問題なのかエラーが出ます

    IE6を使っています。 次のように[a.js]を呼び出したのですが、 オブジェクトがありませんとエラーが出ます。 そのエラーの次に[test.html]にあるalertの内容は表示されます。 どこが間違っているのでしょうか? [a.js] var a = document.body.clientWidth; [test.html] <html> <head> <title>test</title> <script type="text/javascript" src="a.js"></script> </head> <body> <script type="text/javascript"><!-- alert(document.body.clientWidth); --></script> </body> </html>

  • Javascriptの外部サーバーからの読み込み(greybox)

    いつも参考にさせていただいてます。 greyboxを使ってページを表示したいのですが、 使っているサーバーはjsファイルなどがアップロードできない、CMSサービスのサイトなので、 別のレンタルサーバーにアップロードしたjsファイルを読み込んで動かしたところうまくいきません。 模範例では、 ----------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Sample</title> <link rel="stylesheet" href="greybox/gb_styles.css" type="text/css" media="all"> <script type="text/javascript"><!-- var GB_ROOT_DIR = "./greybox/"; // --></script> <script type="text/javascript" src="greybox/AJS.js"></script> <script type="text/javascript" src="greybox/AJS_fx.js"></script> <script type="text/javascript" src="greybox/gb_scripts.js"></script> </head> <body> <h1>GreyBox サンプル</h1> <a href="http://job.mycom.co.jp/" title="job" rel="gb_page[480,360]"> 毎日就職ナビのページ表示 </a> </body> </html> ----------------------------------- なのですが、パスを絶対パスに変えて ----------------------------------- <link rel="stylesheet" href="http://mydomain/greybox/gb_styles.css" type="text/css" media="all"> <script type="text/javascript"><!-- var GB_ROOT_DIR = "http://mydomain/greybox/"; // --></script> <script type="text/javascript" src="http://mydomain/greybox/AJS.js"></script> <script type="text/javascript" src="http://mydomain/greybox/AJS_fx.js"></script> <script type="text/javascript" src="greybox/http://mydomain/gb_scripts.js"></script> ----------------------------------- と変更しました。 成功例(jsファイル同一サーバー上):http://greybox.main.jp/test_ng/index2.html 失敗例(jsファイル別サーバー上):http://greybox.main.jp/test_ok/index1.html 対応方法をお教え下さい。よろしくお願い致します。

  • JSの記述を別ファイルに移す

    下記のHTML内の <script type="text/javascript">~</script> をtest.jsとして別ファイルに移す場合にどのように、記述するればよいのでしょうか。単純にコピペしたのですがうまくいきません。 初歩的だとは思いますが、ご指導をお願いします。 --------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/Draggable.js"></script> </head> <body> <div id="test1" class="test"></div> <div id="test2" class="test"></div> <script type="text/javascript"> var test1 = new Draggable("test1"); var test2 = new Draggable("test2"); </script> </body> </html>

  • shadowbox.jsについて

    shadowbox.jsとslimbox.jsを併用したいと考えています。 もともとshadowbox.jsをPrototypeで使用し、HTMLを呼び出すのに使用していたのですが、 画像のライトボックス表示にslimbox.js(jquery使用)を使いたいと思い、 両方とも記述したらshadowboxの方が正常に動作しなくなりました。 何か解決策はありますでしょうか。 非常に困っています。お願いします。 ちなみに以下の様なコードをhead内に記述しております。 <script src="../../common/js/prototype.js" type="text/javascript"></script> <link rel="stylesheet" type="text/css" href="../../common/js/shadowbox/shadowbox.css"> <script src="../../common/js/shadowbox/shadowbox.js" type="text/javascript"></script> <script type="text/javascript">Shadowbox.init();</script> <link rel="stylesheet" type="text/css" href="shadowbox.css"> <script type="text/javascript" src="shadowbox.js"></script> <script type="text/javascript">Shadowbox.init();</script> </script> <link href="../../common/css/slimbox/slimbox.css" type="text/css" rel="stylesheet" media="screen" /> <script type="text/javascript" src="../../common/js/jquery.js"></script> <script type="text/javascript" src="../../common/js/slimbox.js"></script> <script type="text/javascript"> //slimbox $(document).ready(function() { $('a[rel*=lightbox]').slimbox(); }); </script>

    • ベストアンサー
    • CSS