• 締切済み

複数の外部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ではエラーになってしまったり、表示されなくなったりして上手くいきませんでした…;; よろしくお願いいたします。

みんなの回答

  • arexis
  • ベストアンサー率66% (66/99)
回答No.2

え? なぜに他人事のような…^^; やりたい事と目的がはっきりしていないのですか? それがわからないと、こちらもどうしようもないので <script id="js"></script> <script> var file = '00' + parseInt(Math.random() * 99, 10); document.getElementById('js').src = './' + file.substring(file.length-3) + '.js'; </script> これで000.js ~ 099.js までのランダム指定可能だと思います。 スクリプトタグを読み込んだ直後のIDでの操作ですが多分問題ないでしょう。 あとは状況に応じて操作するタイミングをオンロード後にするなり、 JSファイル側がdocument.writeなら 表示すべき場所に書くなりしてください。 同時に3箇所あって、それをランダムシャッフルなのか、 1箇所で複数のJSファイルからランダムチョイスなのかとか、 詳細がわからないと、これ以上は私では回答しようが無いです。 では。

  • arexis
  • ベストアンサー率66% (66/99)
回答No.1

そのJSファイルの中身ですが document.write() を使用していますか? それともDOM操作でテキストや画像を表示させていますか?

marie_blue
質問者

補足

jsのsrcのアドレスをブラウザで直接開いてみたところ、真っ白でした。 (FireFoxを使っているので、他のjsならたいてい中身が表示されるのですが…) document.writeを使用したものではなさそうですね^^;

関連するQ&A

  • 複数のランダム表示について

    現在、外部のjsを読み込み、 ランダムではなく下記の方法で 4バナー表示をしております。 【index.html】 <script type="text/javascript" src="js/banner.js"></script> 【banner.js】 document.write("<ul class=\"banner\">"); document.write("<li><a href=\"http://1.jp/\" target=\"_blank\"><img src=\"http://1.jp/img/1画像.jpg\" alt=\"1\" width=\"200\" height=\"80\" /></a><br />1テキスト</li>"); document.write("<li><a href=\"http://2.jp/\" target=\"_blank\"><img src=\"http://2.jp/img/2画像.jpg\" alt=\"2\" width=\"200\" height=\"80\" /></a><br />2テキスト</li>"); document.write("<li><a href=\"http://3.jp/\" target=\"_blank\"><img src=\"http://3.jp/img/3画像.jpg\" alt=\"3\" width=\"200\" height=\"80\" /></a><br />3テキスト</li>"); document.write("<li><a href=\"http://4.jp/\" target=\"_blank\"><img src=\"http://4.jp/img/4画像.jpg\" alt=\"4\" width=\"200\" height=\"80\" /></a><br />4テキスト</li>"); document.write("</ul>"); 【ブラウザ】 1画像.jpg 1テキスト -------- 2画像.jpg 2テキスト -------- 3画像.jpg 3テキスト -------- 4画像.jpg 4テキスト 教えて頂きたいのは、下記のように ランダム表示で4つのバナーを表示させたいのですが どうしたらいいか分かりません。 【ブラウザ】 4画像.jpg 4テキスト -------- 2画像.jpg 2テキスト -------- 1画像.jpg 1テキスト -------- 3画像.jpg 3テキスト 詳しい方おりましたらお教え頂けないでしょうか? よろしくお願いします。

  • 外部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"; } ------------------------------------------------------------------------------------

  • バナー(javascript)をランダムで表示

    FC2ブログのプラグインにjavascriptを使ってバナー広告をランダムで表示しています。 今までは問題なかったのですが、新しくバナーを加えた際に、そのバナーがjavascriptで出来たものだったので、どうしてよいものかわからなくなってしまいました。 ランダム表示にはこちらのページを参考、というかコピーしました。 http://javascript.eweb-design.com/0616_ra.html 貼り付けたいバナーのソースです↓ ソースの改変は認められていません。 <!--- ---> <script type="text/javascript"><!--- ---></script> <script src='jsファイルのURL'></script> <noscript></noscript> <!--- ---> これ以外のバナーはgifとリンクで構成されていましたので特に問題ありませんでしたが、そこに上記のjavascriptバナーを加えてランダムに表示することはできますか? 自分で調べてみましたが、自力では見つけられなかったのでココで質問をする事にいたしました。 回答お願いします。

  • 外部 .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> と書いても、何も現れません(ソースで確かめています)。根本的におかしいのかもしれませんが、わかりません。 必ず、これら条件でお願いします。

  • 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の見栄えが悪くなるからという個人的な意見です・・・ 済みませんがお知恵をお貸しください!!

  • 外部ファイルJS参照を全て消さないと「文字が正しくありません」エラー

    実に不思議なのですが、 以下のように4つのJSファイルをインクルードしているHTMLファイルを ローカルで開くと「文字が正しくありません」とスクリプトエラーが何回かでます。 ですが、script1~4.js の行を全てコメントアウトすると、エラーはでません。 1~4のどれかにエラーが含まれているのかと、一つ一つを外してみましたが、 どの行を外しても、やはり「文字が正しくありません」と出てしまいます。 ローカルの然るべきパスに1~4はあります。また、HTML同様、JSもEUCになってます。 何が原因なのでしょうか? <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <title>タイトル</title> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> <meta http-equiv="content-script-type" content="text/javascript"> <meta http-equiv="content-style-type" content="text/css"> <link href="../css/style.css" rel="stylesheet"> <script src="../js/script1.js" type="text/javascript"></script> <script src="../js/script2.js" type="text/javascript"></script> <script src="../js/script3.js" type="text/javascript"></script> <script src="../js/script4.js" type="text/javascript"></script> </head>

  • ブログ上で複数のjavaスクリプトから2つのjavaスクリプトをランダムに表示させたい

    ブログ上に、複数のjavaスクリプトからランダムに2つのjavaスクリプトを選んで表示させたいのですが、コードがわからないので教えていただきたいです。選ばれた二つは被らないようにしたいです。 使用したいjavaスクリプトのコードは <script type="text/javascript" charset="euc-jp" src="○○1"></script> <script type="text/javascript" charset="euc-jp" src="○○2"></script> <script type="text/javascript" charset="euc-jp" src="○○3"></script> のようになっています。 javaを使って画像や文字をランダムに表示する方法はあったので応用しようとしたのですがうまくいきませんでした。 よろしくお願いします。

  • 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
  • 複数jQueryの配置で干渉 設置位置

    Javascript事は全くわかりませんが、色々なプラグインとしてjQueryを利用しています。 ----------------- jQueryに干渉があったようで、正常に動作させたいのですが、疑問があります。 1サイト目(HTML 最下部に配置) <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> 正常に動作します。 2サイト目(HTML head内に配置) <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> 正常に動作します。 上記の2サイトを合体させた:(HTML 最下部に配置) <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> <script src="js/abcd.js" type="text/javascript"></script> すると、 layout.min.jsに不具合がでるようです・・・ <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> でも、ダメです。 <script src="vendor/jquery.min.js" type="text/javascript"></script> を <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> に変更してもダメでした。 tel.js内を、 jQuery.noConflict(); (function($) { $(function(){ を $j に変えたり、 jQuery に 書き替えてもダメでした・・・ そこで、以下のように移動しましたら動作しました。 (HTML header内に配置) <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> (HTML 最下部に配置) <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> 上記のように、 HTML head部と、HTML 最下部に分けるのは、正しい方法なのでしょうか?

  • 外部 js ファイルの動的読み込み

    通常、HTML で外部の Javascript ファイルを読み込む必要がある場合、 <script type="text/javascript" src="****.js"></script> としますが、これを Javascript のコード内で行いたい場合、何か方法はあるでしょうか? いわゆる、Perl での use や php での require のようなことを Javascript で実現したい - 動的に js ファイルを読み込みたいのです。 以上、お分かりになる方、よろしくお願いします。

専門家に質問してみよう