Step.1 - JavaScriptを埋め込もう!

いきなり、JavaScript を使って、使用中のブラウザ名を表示してみましょう。
JavaScript も タグ同様、ブラウザやOSによって使える命令があったり、使えない命令があったり、結果が違ったりするケースがあります。

Step テーマ

これからJavaScriptサンプルとして次のように記載していきます。当JavaScript講座のサンプルはそのままの形ですぐ使えるようになっています。

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

【リスト】 ← JavaScript のサンプルリストです。

【使い方】 ← サンプルの使い方、もしくは改造方法等の説明です。

【説明】 ← JavaScript のサンプルの説明です。ステップのテーマに沿った説明をします。

【高度な説明】 ← 突っ込んだ説明をしています。最初のうちは読まなくても構いません。

【リファレンス】 ← そのステップのテーマであるプロパティやメソッドのマニュアルです。最初のうちは読まなくても構いません。

【Q&A】 ← そのステップの応用や改造方法等のQ&Aです。特に読まなくても構いません。

【それ以外のタイトル】 ← どうせ、つまらんことを書いているので、読まなくて構いません。


実行例



リスト

<script type="text/javascript">
<!--
document.write(navigator.appName);
// -->
</script>


使い方

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

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

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

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

のようなタグになります。タグは少しは分かりますよね?
当講座はタグはある程度は理解していることを前提にしています。

※ 死滅した古臭いタグを見て驚いていたのならスミマセン。この講座は 1999年〜2002年に作られているもので。。

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

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

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

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

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

サンプルだけの HTML は こちらへ

説明

<script type="text/javascript">
<!--
document.write(navigator.appName);
// -->
</script>

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

<script type="text/javascript">
ここにJavaScriptを書き込む
</script>

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

そこで、
<script type="text/javascript">
<!--
ここにJavaScriptを書き込む
// -->
</script>

とすると、未対応ブラウザはコメント扱いして、JavaScriptを素通りして表示しません。

また、<!-- のあとは必ず改行して次の行から JavaScript を記述してください。

<script type="text/javascript">
<!-- ここにJavaScriptを書き込む // -->
</script>

↑ こんな感じで記述すると JavaScript そのものが本当のコメントになってしまいます。


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

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

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

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

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

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

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

▲TOP

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

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

 それは、たとえば中学校で初めて英語の授業を受けたときに、
Hello, Taro.
なる文が出てきたとしましょう。初めて目の当たりにする英文(英単語)です。

「太郎 = Taro」 は百歩譲って理解できたとしても、なぜに「ハロー」の「ハ」は「Ha」じゃなくて「He」なんだ! とか、なぜに「エル」が2つもあるんだ! なんて、この段階で考え込んでしまっている状態です。

 今の段階では、それを理解することはまず不可能です。本当に親切な人にどうしても納得がいくように説明してくれと頼んでも、「そう気にするな」とか「そんなものだよ」と返ってきて「回答になっていない! もう英語の勉強はヤメだ!」となるか、長文で且つ内容もややこしく、聞いたことがない言葉を並びたてられて、「もういい! 俺には英語なんて無理だ!」となります。

 他のみんなも同じ疑問を抱いているはずだと思えば、「ふーん、これが英語ってものなのか」とあっさりと受け入れて先へ進んで行く人たちもいます。
JavaScriptも同様に段階として見て慣れていくというのも重要で、慣れる前に深みにハマると挫折するシロモノです。また、ある程度慣れてくる頃には当初疑問に思っていたことも知らぬ間に解決しているという、どの様な事をどの様な順番で学んでいけば良いかも説明しづらいシロモノでもあります。

 また、プログラムも日常の会話と同様に人それぞれに表現方法があります。たった1冊の本や、当コンテンツのみでプログラミングをマスターしようと思っていれば、それは危険です。言葉の中で同じ意味でも丁寧口調の表現もあれば、喧嘩口調の表現もあるように表現の仕方は無数な程あります。さらにはプログラミング方法も人それぞれの考え方と同じで「答え」は無く、人によって賛否に分かれます。人や本に教わるものの、最後には自分で自分の道を判断しなければならない要素もあるので1箇所の情報をそのまま鵜呑みにして満足していくような姿勢であってはいけません。

 ましてや、ネット上の個人サイトの情報ほど鵜呑みにするのは危険です。それらの中には単なる推測や自己主張の自己満足的な趣味ページが多く、当サイトがその典型的なものでこの文章も、そのものズバリであります。「賛否」どころか真のウソもあると思います。1つ1つが「分りました」ではなくて「参考になりました」の慎重さが必要です。

 付け加えて、当コンテンツには初心者の皆さんから「このサイトは本屋で買ってきた解説本より説明が丁寧であり親切であり分かりやすい」という感想のメールをたくさんいただいています。この系統はウソでもやっぱり頂ければうれしいです。

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

ん? そういう行き詰まりじゃなくて、リスト中にいっぱいある括弧<> がついてるやつってなんだよ!?
そこで行き詰まっているのは、日本語も知らずに日本語で書かれた英会話入門にて英語を学ぼうとしている状態です。JavaScriptより先にタグを勉強しましょう。^^;

▲TOP