目次へ戻ります
イヌでもわかるJavaScript講座


JavaScriptを埋め込もう!

いきなり、JavaScript を使って、使用中のブラウザ名を表示してみましょう。

JavaScript も タグ同様、ブラウザやOSによって使える命令があったり、使えない命令があったり、結果が違ったりするケースがあります。
難易度:★☆☆☆☆☆☆☆☆☆
これからJavaScriptサンプルとして次のように記載していきます。本JavaScript講座のサンプルはそのままの形ですぐ使えるようになっています。

【実行結果】 ← JavaScript のサンプルを実際に動かしてみます。


【リスト】 ← JavaScript のサンプルリストです。
<script language="JavaScript">
<!--
document.write(navigator.appName);
// -->
</script>


【使い方】 ← JavaScript のサンプルを自分用に変えるための説明です。

【説明】 ← JavaScript のサンプルの説明です。

【高度な説明】 ← 突っ込んだ中級向けの説明をしています。



さて、この【リスト】のサンプルをどのようにしてHTMLファイルに埋め込むか ・・・。
その答えは非常に簡単です。そのまんま埋め込めばいいのです。(^^;

HTMLで次のように表示するには、

あなたのブラウザはなんですか?

<p><font color="#0000FF" size="4"><strong>
あなたのブラウザはなんですか?
</strong></font></p>

のようなタグになります。タグは少しは分かりますよね?
タグを知らないのであれば、まだまだ JavaScript に手を出すのは早いと思いますよ。
当講座もHTMLはある程度は理解していることを前提にしています。

では、JavaScriptを使った次のような文を表示するには、

あなたのブラウザは ですか?

は、上のHTMLサンプルのなんをそのまま、JavaScriptサンプルに書き換えればよいのです。

<p><font color="#0000FF" size="4"><strong>
あなたのブラウザは
<script language="JavaScript">
<!--
document.write(navigator.appName);
// -->
</script>
ですか?
</strong></font></p>

おわかりいただけたでしょうか? 簡単でしょ?
HTMLエディタでJavaScriptを書き込むことはできますが、エディタの種類が多いため、ここではHTMLエディタでの説明は省きます。(^^;

サンプルだけのHTMLは こちらへ
【説明】

<script language="JavaScript">
<!--
document.write(navigator.appName);
// -->
</script>

JavaScript は<script language="JavaScript"></script>のあいだに書いていきます。

<script language="JavaScript">
ここにJavaScriptを書き込む
</script>

しかし、このままだと、JavaScript 未対応のブラウザで表示すると、JavaScript が実行されずに、JavaScript のプログラムリストそのものが文字として、そのまま、ホームページに表示されてしまいます。

そこで、
<script language="JavaScript">
<!--
ここにJavaScriptを書き込む
// -->
</script>
とすると、未対応ブラウザはコメント扱いして、命令文を素通りして表示しません。

また、<!-- のあとは必ず改行して次の行からJavaScriptを記述してください。
<script language="JavaScript">
<!-- ここにJavaScriptを書き込む // -->
</script>
↑こんな感じで記述するとJavaScriptそのものが本当のコメントになってしまいます。


では、まん中の
document.write( navigator.appName );
は、なにをしているのでしょう?

SCRIPT中で文字を表示させるためには、
document.write();
という命令を使わないと表示できません。


あいうえお』を表示するには、document.write( "あいうえお" ); となります。

navigator.appName には、現在使っているブラウザ名の文字が、すでに格納されています。

そこで、
document.write( navigator.appName );
とすれば、ブラウザ名が表示されるわけです。

このように JavaScript を使うと変化のある表示ができるのです。

なんとなく、わかったでしょうか? このJavaScript講座はここでなんとなくわかれば、十分やっていけます。(^^;

【いきなり行き詰まって先へ進めない方へ & 当サイトの危険性】

 このステップにて既に頭の中が謎だらけになってしまい、頭を抱え込んでしまった方は、私が推測するには「ちょいと物事を深く考えすぎる性格」の方かと思われます。

 それは、たとえば中学校で初めて英語の授業を受けたときに、
Hello, Taro.
なる文が出てきたとしましょう。初めて目の当たりにする英文(英単語)です。
「太郎 = Taro」 は百歩譲って理解できたとしても、なぜに「ハロー」の「ハ」は「Ha」じゃなくて「He」なんだ! とか、なぜに「エル」が2つもあるんだ! なんて、この段階で考え込んでしまっている状態です。
 今の段階では、それを理解することはまず不可能です。本当に親切な人にどうしても納得がいくように説明してくれと頼んでも、「そう気にするな」とか「そんなものだよ」と返ってきて「回答になっていない! もう英語の勉強はヤメだ!」となるか、長文で且つ内容もややこしく、聞いたことがない言葉を並びたてられて、「もういい! 俺には英語なんて無理だ!」となります。
 他のみんなも同じ疑問を抱いているはずだと思えば、「ふーん、これが英語ってものなのか」とあっさり理解して先へ進んで行く人たちもいます。
 JavaScriptも同様に段階として見て慣れていくというのも重要で、慣れる前に深みにハマると挫折するシロモノです。また、ある程度慣れてくる頃には当初疑問に思っていたことも知らぬ間に解決しているという、どの様な事をどの様な順番で学んでいけば良いかも説明しづらいシロモノでもあります。

 また、プログラムも日常の会話と同様に人それぞれに表現方法があります。たった1冊の本や、当コンテンツのみでプログラミングをマスターしようと思っていれば、それは危険です。言葉の中で同じ意味でも丁寧口調の表現もあれば、喧嘩口調の表現もあるように表現の仕方は無数な程あります。さらにはプログラミング方法も人それぞれの考え方と同じで「答え」は無く、人によって賛否に分かれます。人や本に教わるものの、最後には自分で自分の道を判断しなければならない要素もあるので1箇所の情報をそのまま鵜呑みにして満足していくような姿勢であってはいけません。
 ましてや、ネット上の個人サイトの情報ほど鵜呑みにするのは危険です。それらの中には単なる推測や自己主張の自己満足的な趣味ページが多く、当サイトがその典型的なものでこの文章がそのものズバリであります。「賛否」どころか真のウソもあると思います。1つ1つが「分りました」ではなくて「参考になりました」の慎重さが必要です。

 付け加えて、当コンテンツには初心者の皆さんから「このサイトは本屋で買ってきた解説本より説明が丁寧であり親切であり分かりやすい」という感想のメールをたくさんいただいています。この系統はウソでもやっぱり頂ければうれしいです。
 ところで、なぜにプロが書く本よりも分かりやすいかというと、実は「説明の内容はいい加減であり、適当に書いている」からなのです。これは本当に人に親切にプログラミングを教えようとすれば知らなければならない正規の専門用語を用い、誤解が生まれないように事細かく説明する必要がありますが、私の親切とは専門用語を極力使わずに、至ってシンプルに説明するという相反した方法を考えています。ですから、当コンテンツで分ったようにあっても実はそんなに分ってはいません。または、分ったようにあっても実は勘違いして理解しているかもしれません。つまり分りやすいように見えるだけなのです。

ん? そういう行き詰まりじゃなくて、リスト中にいっぱいある括弧 < > ってなんだよ!?
そこで行き詰まっているのは、日本語も知らずに日本語で書かれた英会話入門にて英語を学ぼうとしている状態です。タグを知らない方は当コンテンツはさすがに門前払いとなっております。

タグも知ってるんだ!そうじゃなくて、どうやってエディタに書き込むんだ!?
当コンテンツでは、さすがに無視という方向を取らせて頂いております。

目次へ戻ります