HP上のデータ部分に検索機能を設ける為には？

質問

私は、下のサイトに倣って架空の力士の四股名を載せるHPを作成したいと思っています。

http://www.szumo.hu/Sumotori/

例えば、「出身地」のボタンがありますが、ここをクリックすると

http://www.szumo.hu/Sumotori/index-birthplace.html

上のように県名や国名がズラリと並んだページが出て来ます。
ここで、例えば「モンゴル」のボタンをクリックすると、下のようにモンゴル出身の力士の名前がズラリと表示されます。

http://www.szumo.hu/Sumotori/Rikishi-Mongolia.html

私が作りたいHPにもこういう機能を設けたいのですが、具体的にどのようにすれば良いのでしょうか？

また、私はデータの部分はデータ整理の利便性（？）や装飾を理由にエクセルで作成予定です。

どなたか御回答を宜しく御願い致します。

回答No.3

mazimekko3

htmlファイルの構成も分からないといっているのですか？
セレクトメニューによるリンクはjavascriptの知識も必要です。
少なくともhtmlの超基本のタグの意味ぐらいは理解していないと話になりません。
「初心者だから」で何でも聞けると思わないでください。
Web上の（この手のリンクに関する）文献は山ほどあります。
少しぐらいは自分で勉強してください。

> 外部スクリプト（.js）として保存してください。
メモ帳等テキストエディタで作ったファイルを拡張子[.js]で保存してください。
ファイル名は半角アルファベットです。

先にあげた外部スクリプトの中で書き換えるのは以下のみ。
document.write('<option value=\"URL_1\">Link1</options>\n');
document.write('<option value=\"URL_2\">Link2</options>\n');
document.write('<option value=\"URL_3\">Link3</options>\n');
URL_*には実際にリンクするＵＲＬを
Link*には実際に表示するテキストを入れます。
増やしたかったらいくらでも増やしてください。

document.write('<input type="button" VALUE="Go" onclick="jump();">');
Goはボタンの文字です。好きなように書き換えてください。

先に言わなければいけなかったのですが
この手のデータベースっぽく作るサイトは非常に手間がかかります。
質問者さんが希望している「検索型」のサイトは
これぐらいの構成が理解できないようではまったく手も出ません。
html初心者ならこんな複雑で多種の知識が必要なサイトより
普通に<a>タグでリンク張ったり<li>でリスト作ったりしたほうが
簡単で見栄えもいいと思いますよ。

補足

回答有り難う御座いました。

htmlの知識については、本屋で何か専門書でも買って読んでみようと思ったりもしましたが、憶える量が多過ぎて勉強を始めるにも手が出せないというのが正直なところでした。１つ１つ憶えようとしても、憶えたい内容が片っ端から頭から抜け落ちていってしまうのです。我ながら全く話にならないと思いました。

ところでリストの件ですが、データの量が余りに膨大過ぎる為検索型のサイトにせざるを得ないと思ったのです。
兎に角、この方法では非常に手間が掛かる、初心者には簡単に手が出ないことが分かりましたので御礼をさせて頂きたいと思います。

ありがとうございました。