ランダムリンクについて 2002.5.16.Thu No.3485
ぴろあきさん、いつもお世話になり誠に有難うございます。またまた質問ですが、宜しければ教えて下さい。
絵をクリックするとランダムに飛ぶという、いわゆるランダムリンクボタンを作ってみたのですが、上手く機能しません。以下のスクリプトに誤りがありましたら、或いは「こっちの方が分かりやすいぞ」というようなスクリプトがございましたらお手数ですが、ご一報頂ければ幸いです。
<script language="JavaScript">
function LinkRan()
{
switch(Math.round(Math.random()*3)){
case 0: {
location.href = "C:\WINDOWS\テ゛スクトッフ゜\aska\HP\aaa.html" ;
break ;
}
case 1: {
location.href = "C:\WINDOWS\テ゛スクトッフ゜\aska\HP\profile.html" ;
break ;
}
case 2: {
location.href = "C:\WINDOWS\テ゛スクトッフ゜\aska\HP\好きなこと.html" ;
break ;
}
}
}
</script>
<table align="right">
<a href="JavaScript:LinkRan();">
<img src="C:\WINDOWS\テ゛スクトッフ゜\aska\animation.gif" border="0"></A></table>
いつもいつも有難うございます。
Re:ランダムリンクについて ぴろあき 2002.5.16.Thu No.3491
最初にひとつ。
"C:\WINDOWS\テ゛スクトッフ゜\aska\HP\好きなこと.html"
という指定は、自分のパソコンでは動きますけど、サーバーにアップロードしたら絶対に動かないので注意してくださいね。念のため…。(フロントページとかの作成ソフトを使うとよくやってくれます)
それで、ランダムリンクみたいな使い方をする時、switch
構文は融通という点で向かないです。以下のようにしてみたらどうでしょう?
function LinkRan()
{
var path = new Array(); //変数 path を配列にする宣言
path[0] = "aaa.html"; //path の0番に "aaa.html" を入れる
path[1] = "profile.html"; //path の1番に以下略
path[2] = "like.html";
//配列数の範囲内でランダムな数値を作る
var randomNum = Math.floor(Math.random() *path.length);
//できた数値の配列番号に入ってるパスへジャンプ
location.href = path[randomNum];
//false を返して href のリンク動作をキャンセルさせる
return false;
}
このようにしておくと、path[x]
配列を直すだけでいいので、管理が簡単です。
そしてそれを呼び出すリンクは、
<a href="aaa.html" onclick="return LinkRan()">
という方法がおすすめです。(Netscape2 で動かない欠点はありますが、さすがにもう絶滅状態ですので)
href="aaa.html"
と入れておくと、JavaScript 非対応環境や、右クリック→新しいウィンドウ を選んだ時に、aaa.html
が開かれます。普通にクリックした場合にのみ、LinkRan()
が動きます。
onclick="return LinkRan()"
は、LinkRan()
を実行して、返ってきたやつをさらに href=""
へ返します。LinkRan()
関数からは false
を返すようにしているので、href
のリンク動作はキャンセルされます。つまり、true
を返せば href
も作動します。
これを知っておくと、作れるスクリプトの幅が広がりますので、憶えておくとお得ですよ。
例:IEだったらランダムリンクを動作させて false
を返し、Netscape だったらランダムリンクさせずに true
を返す…など
以上、お試しください。
関係ないですが、<table>
の書き方が違います…。(最低でも <tr>
と、<td>
または <th>
が必要です)
言われてみれば… 2002.5.17.Fri No.3498
今日は、ぴろあき様
先日はランダムリンクについてご助言下さり、有難うございました。
言われてみればその通りですよね…ソフト無しでやっていたので気付きませんでした。
非常ー――――に初心者のどん底な質問で恐縮ですが、
これはどうやって修正したら宜しいのでしょうか…
悲しいまでに、基本的な質問ですが、教えてやって下さい(T_T)
Re:言われてみれば… (回答者2) 2002.5.17.Fri No.3499
横から失礼します。
好きなこと.html
→ sukinakoto.html
と修正すれば大丈夫じゃないでしょうか?
日本語で入力された名前等は使用できません。
Re:言われてみれば… (回答者3) 2002.5.17.Fri No.3500
まさかとは思いますが…
webのurlを指定していないのでは!?
私は初めてHP作った時にやってしまいましたが(-_-;)
自分のPCでは見れていたので友達に見てみて〜って言ってオオハジかきました彡
Re:言われてみれば… ぴろあき 2002.5.17.Fri No.3503
上記でお二人がおっしゃってる通り、ホームページに使うフォルダやファイルの名前は、半角の英数字と一部の記号だけしか使えません。世界中につながるインターネット、日本語がわかるコンピュータなんて、ほんの一握りですしね。
加えて、大文字と小文字が区別されます。これ、必ずやるミス(Windows は区別しないので、アップするまで気づかない)ですので、どっちかに統一しておくと安心です。
"C:\WINDOWS\テ゛スクトッフ゜\aska\HP\好きなこと.html"
この引用符の中は、<A href="">
の中身と同じです。
path[0] = "aaa.html"; //同じフォルダの aaa.html へ
path[1] = "../index.html"; //ひとつ上のフォルダにある index.html へ
path[2] = "profile/like.html"; //profileフォルダの中にある like.html へ
path[3] = "http://www.google.com/"; //googleへ
など、絶対パスや相対パスでファイルのある場所を指定するだけです。
もし「パス」そのものについての質問だった場合、これじゃ意味わかりませんね。
その時はお手数ですが、再度の質問をお願いします。
ありがとうございます。 2002.5.19.Sun No.3506
>webのurlを指定していないのでは!?
えっ???
webのurlとは、どういう事なのですか?(もうこの子駄目だ…/涙)
>この引用符の中は、<A href="">
の中身と同じです。
>絶対パスや相対パスでファイルのある場所を指定するだけです。
>もし「パス」そのものについての質問だった場合、これじゃ意味わかりませんね。
これは、そのアドレスの後ろにつけるものでしょうか。
そしてパスとは何でしょう?
先生方、御迷惑を更にお掛けして生みませんが、もう暫しお付き合い下さいませ(T_T)
Re:ありがとうございます。 (回答者2) 2002.5.19.Sun No.3508
こんばんわ。cgiの勉強してたらこんな時間になってしまいました。
早速ですが、webのurlとはインターネットのアドレス。と考えてもらって大丈夫だと思います。
パスとは、う〜ん。そのファイルまでの経路って感じです。
例えば、Googleまでのパス(経路)は、http://www.google.com/ です。
この http から始まるパスを絶対パスといいます。
相対パスとは、自分の開いているファイルからたどる経路のことです。
現在開いているファイルが aaa.html
だとすると、ひとつ上のフォルダにある index.html
を見る場合、../index.html
とします。
これを相対パスっていいます。
こんな感じで分かっていただけるでしょうか?
説明下手ですいません。間違ってたらすいませんです。
Re:ありがとうございます。 ぴろあき 2002.5.20.Mon No.3515
まぁそう落ちこまずに。最初から知ってたら、赤ん坊でも東大に現役合格できてしまいますよ。(現役?)
とりあえずパスについて、最初から順を追って説明を書いてみたので、お暇があれば見てみてください。
http://faq.creasus.net/02/0520/
すみません… 2002.5.21.Tue No.3524
数日間ネット落ちしていた為お返事が遅れてしまい、申し訳ありません。有難うございます。
お手数も煩わせたようで申し訳ないです。おかげさまで何とかなりそうです。
ああ…返事が遅れてなんだかタイムラグが…マヌケだ…(泣)
とはいえ、皆様にはお世話になりました。本当に有難うございます。
"C:\WINDOWS\デスクトップ\aska\HP\好きなこと.html"
のように、ファイルのある場所を示す一列を、「パス」と言います。Pass
じゃなくて Path
です。
直訳すれば「道・進路・経路」で、いわゆるファイルのある場所です。ファイルの住所、とも言えますね。上の例の場合、「Cドライブの "WINDOWS" フォルダの "デスクトップ" フォルダの "aska" フォルダの "HP" フォルダにある、"好きなこと.html"」という意味ですよね。
ご存知と思いますが、\
や /
はフォルダごとの区切りを表します。Windows ではどちらも使えますが、インターネットでは /
だけです。
パスには「絶対パス」「相対パス」という難しい名前の2種類がありますが、どっちを使ってもパソコンが自動で見分けてくれますから、人間様は正しいパスを書くことだけに集中します。
「絶対ここにあるパス」と解釈します。住所で言うなら「日本国○○県△△市××町1-2-3」で、世界中のどこにいても、必ず目的地へ行けますよね。つまり、「重複した住所は存在しない」わけです。
主に二通りの呼ばれ方がありますが、インターネットでは絶対パス、自分のパソコンの中ではフルパスと区別されることが多いです。これは習慣的なものでしょう。
絶対パスをぶっちゃけて言えば、
http:
で始まる。C:\
や D:\
のように始まる。(これは Windows の場合)…です。
そして、インターネットでは C:\
の形を使うことはありません。http:
で始まるか、下記の「相対パス」を使うか、二択です。(「webのurl」とは、このふたつのことを指します)
面倒くさければ「絶対パスは他のサイトにリンクを張る時だけ使う」と憶えておきましょう。
http:
で始まる」ではありません。
他にも https: ftp: file: mailto: news: gopher: nntp: telnet: wais: prospero:
ついでに sstp:
などなど、阿呆みたいにあります。前者4つは見る機会も多いですが、これらは望まない限り知る必要もないでしょう。
また、これらに加えて javascript: livescript: mocha: view-source: about: montulli:
なんていうのもあります。
そして、「xxxx:
で始まる=絶対パス」でもないです。(これらには「スキーム」という名前が付いてます)
「今いる場所から見たパス」で、自分のサイト内にリンクを張る時は、通常こちらを使います。これ、あまりに簡単すぎて、逆にうまく説明できないんですよね。
初めのうちはたしかに少しややこしいですが、感覚でなんとかなっちゃうものなので、一回わかれば実にあっけないです。難しく考えるほどハマります。
その仕組みを説明するには通常「道案内」のたとえを使うのですが、ここは結果優先で行きましょう。
「index.html
から like.html
へ(相対パスで)リンクを張りたい」
大基本:
相対パスは「../
+ フォルダ名/ + ファイル名」の3つの部品を順番に組み合わせて作る。
部品がなかったり複数あったりはしても、順番が入れ替わることはない。
まず、index.html
があるフォルダをエクスプローラかなんかで開きます。
同じフォルダに like.html
が一緒に入ってれば、今いる場所から動いてないので、そのまま
<a href="like.html">like.htmlへリンク</a>
と、ファイル名を書くだけで終わりです。スクリプトの場合もたいして変わらず、
path[0] = "like.html";
です。もちろんスクリプトの場合は通用しないこともありますが、サンプルとして公開されているものは、こんな感じで指定できるようにしてあるはずです。
あっけないですね。
つまり、全部のファイルをひとつのフォルダにまとめちゃうのが、一番簡単な方法です。
どこか別のフォルダに like.html
がある時は、まず、紙と鉛筆を用意します。
そしてエクスプローラを操作して、そのフォルダまで行ってみてください。ただし、左側にあるフォルダツリーを使って横着しちゃダメです。
この時、
../
と書きます。3つ上がったら ../../../
になります。/
(スラッシュ)を足します。document
フォルダに入ったなら、document/
と書きます。さらに profile
フォルダに入ったなら、document/profile/
となります。like.html
のあるフォルダに辿り着いたら、ファイル名を 2. の最後に足します。これは必ず書かないといけません。(特例を除く)これで「index.html
から like.html
への相対パス」ができます。
3つ上に上がって document
フォルダ → profile
フォルダに入ったなら、
../../../document/profile/like.html
となってるはずです。これが、いわば index.html
から like.html
までの道路地図です。
あとは
<A href="../../../profile/like.html">like.htmlへリンク</A>
path[0] = "../../../profile/like.html";
で相対パスリンクの完成。
パソコンはこの通りに辿れば、like.html
まで行くことができますね。
絶対パスとは「ファイルの住所」です。ただし、インターネットと自分のパソコンは「別の惑星」というレベルで違うので、自分のパソコンでのパス(C:\
の形式)は、インターネットでは無意味です。
インターネットの絶対パスは、インターネットのどこにいようと、必ずそこへ行けます。
自分のパソコンの絶対パス(フルパス)は、どこのフォルダ・ドライブにいようが、必ずそこに行けます。Windows で言う「ショートカット」が、この形式です。
葉書に住所を書いたら、それが合ってる限り、必ず届きますよね。
パスが一文字でも変わったり、あるいは間違えたりすると、リンクが切れてしまいます。
宛て先で福島県を福岡県と間違えたら、全然別のとこに行っちゃいますよね。
これは相対パスにもあるデメリット…というか、あたり前ですね。
相対パスとは「index.html (のあるフォルダ)
から like.html
への行き方を書いた道路地図」です。他のフォルダにあるファイルからは、また違うものになります。
道路地図に書いてある行き方が変わらない限り、リンクが切れないことです。
自分の住んでる町の名前が変わったら、他の町からの郵便は届かなくなるけど、近所の友達の家へは同じ地図で行けますよね。
具体的には、自分のパソコンでもサーバーでも、たとえホームページを引っ越しても、リンクが切れません。もしリンクが全部絶対パスだったら、引っ越ししたら全滅することになります。だから普通は相対パスを使うわけです。
地図がちょっと変わっただけでリンクが切れます。
友達の家が引っ越したら、行っても本人はいませんし、自分が引っ越したら、友達の家への行き方も変わります。
つまり、地図が役に立たなくなりますよね。
要するに「フォルダ名やファイル名などの構成をみだりに変えちゃダメ」ということです。
また、ドメイン(http://www.xxx.yy.jp/
までの部分)が違うと、相対パスは使えません。他の人のサイトへリンクを張るのは、必ず絶対パスを使います。
実は、パスにはもう一種類あります。絶対パスと相対パスを併せたような意味をもち、使いようによっては結構便利ですが、デメリットもあるので使ってる人はあまりいません。
余裕があったらついでに憶えておくと、得することもあるでしょう。
<a href="/index.html">トップの
index.html
へ</a>
先頭に /
が付いてるのが、この形式。意味は「ルートからの絶対パス」です。ルートとは、「一番上のフォルダ」です。一番上のフォルダとは、「ドメイン名の直下」です。
アドレスバーを見ると「http://faq.creasus.net/02/0520/
」となってますよね。太字になってるとこがドメイン名です。この場合、http://faq.creasus.net/index.html
へのリンクと同じ意味になります。
サイトを引っ越しても、変わったのがドメイン名だけならリンク全滅の憂き目に遭いません。
また、これは自分のパソコンでも同じです。自分のパソコンではドライブが「一番上のフォルダ」ですから、C:\
とか D:\
からの絶対パスとなります。
上記の例では C:\index.html
へのリンクになります。(C:\
は今いるドライブによって変わります)
しかし普通の人はドメイン名の後に ~piroaki
みたいなアカウント名が付きますし、サーバーと自分のパソコンでフォルダ構成を合わせておかないといけないので、使い勝手はいまいち良くないです。自分ドメインとサイト専用のドライブを用意すれば、かなり使えるんですけどね。
<a href="./index.html">今いるフォルダの
index.html
へ</a>
先頭に付いてる ./
は「今いるフォルダ」を表しますが、付けなくても同じなので、無理して使う必要はありません。
基本はなんといっても相対パスです。どうしてもわかんなければ、全部のファイルをひとつのフォルダにまとめてしまう方法がいいかも。こうしておけば、ファイル名を書くだけですみます。(ただし、サイトが成長するに従ってフォルダの中身がすごいことになって、管理が非常に面倒くさくなります)
相対パスの知識は、HP作成ソフトを使っていても必要になりますから、この機会にぜひ憶えておきましょう!
このページは、質疑応答掲示板で使用した回答の残骸です。検索エンジンに捕まったりリサイクルしたりすることもあろうので、なんとなく残してあります。広く公開しているページではありませんが、第3者の閲覧を禁止するものでもありません。
恒久的なURIは保証できないものの、よほどのことがない限り削除されることはないでしょう。心配性な人はページの保存をおすすめします。(IEは mht 形式でないと保存できないかも)