わからないことが次々でてくる Javascript
このHPは「ホームページ・ビルダー22」で書いていますが、「プレビュー」で確認すると、『このオブジェクトはサポートしていません』などのエラーが表示されて、しばしば、JavaScriptがうまく動かないことが出てきます。
ホームページビルダーは便利だが遅れている
ホームページビルダーがJavaScriptの更新に対応できていないことなのでどうしようもないのですが、HPビルダーを100％信用していると思わぬトラブルに悩まされます。
この場合は、面倒でも、度々いったんファイルを保存して、グーグルクロームで動作確認しないといけないのですが、このように、自分が書いたコードが間違っていなくても動かなかったり、ブラウザごとで使用が違うことがJavaScriptには残っていて、私のような入門者には「まだまだJavaScriptはやさしくない」のは否めません。
非推奨の命令語は避けるのが無難
下は、サイコロを100回振って、1から6の目が何回ずつ出るのかを計算させるJavaScriptで、ここで、WEBでも目にする、「非推奨」とされている「.writeや.writeln」を試しに使ったのですが、これらは確実に問題を引き起こします。
「.writeや.writeIn」は、結果を簡単に表示できる便利な命令で、これが使えないのは入門者にとって不便なのですが、ここでは、それらを使うと、CSSが乱されて、画面が乱れてしまうことを確認して、これも大変なことだとわかりました。
もちろん、私のHPでは、script中の.writeや.writelnはすべて削除しましたし、対策の方法（の一例）は、私のこちらのページを参考にしていただくと良いでしょう。
PR＊＊＊＊＊＊＊＊＊＊
こんなプログラムを動かしてみて表示状態の異常を調べました。（プログラムは安全のためにつけていません）
let one=0,two=0,three=0,four=0,five=0,six=0; //最初はすべて0
for (let i=1; i<=100; i++) { //100回繰り返します
let sai2 =Math.floor(Math.random()*6+1); //【計算】1～6の目を出します
switch (sai2) { //出た目を1～6に振り分けて合計します
case 1: // 1の目の場合
one = one+1;
break;
case 2:
two= two+1;
break;
case 3:
three= three+1;
break;
case 4:
four= four+1;
break;
case 5:
five =five+1;
break;
case 6:
six= six+1;
break;
}
}
//ここから、1～6の合計を書き出します。
//正しく改行するためのオマジナイ<pre>～</pre>を入れています
document.writeln('<pre>');
document.writeln('100回サイコロを振ってそれぞれの目の出る数を数えました。');
document.writeln('1は ' + one + ' こです。');
document.writeln('2は ' + two + ' こです。');
document.writeln('3は ' + three + ' こです。');
document.writeln('4は ' + four + ' こです。');
document.writeln('5は ' + five + ' こです。');
document.writeln('6は ' + six + ' こです。');
document.writeln('</pre>');
document.close();
この内容は、ランダム関数random()で0から1の乱数を作って、Math.floorで小数以下を処理して1～6の目を出して、それを100回繰り返して、その合計を集計し、結果を「非推奨の writeln 」で表示させているものです。（このページには、トラブルを避けるために、プログラムはありません）
「document.write」は、少し前までは便利に使えていた「テキストなどを表示をする命令」で、「document.writeln」はテキストなどを表示後に改行してくれるはずなのですが、動かしてみると、まず、うまく整列してくれません。
そこで仕方無しに、<pre>～</pre>などの小細工を入れて見た目は良くしてみたものですが …。 それ以外に根本的な問題が発生しています。
PR
「非推奨」の「writelnやwrite」はCSSを乱すので使用不可
「writeln」や「write」などのメソッドは、この命令を書いた位置に「思いのままに」テキストが表示される、非常に使い勝手が良い（良かった）命令です。
使ってはいけないと言われると、なぜなのかを調べてみたくなります。
【その結果・・・】 例えば、<script>～</script>を<body>内の文章の初め部分に書くと、</sprict>部分の下の部分から、CSSがバグって、書式が完全に崩壊することが分かりました。
本文中に上のJavaScriptを<sprict>～</sprict>に入れ込むと…
このように、<sprict>中に writelnがある後ろの部分から、すでに書いてあるCSSの内容が破壊されてしまいます。
そして次に、本文の最後（フッターの上）に<sprict>～</sprict>を置いた場合には …
<sprict>を置いた上側部分の表示に異常はないのですが、やはり </sprict>のあとの部分は書式が乱れてしまっています。
そこで試しに、<sprict>中の.writelnの行（上の例の10行）だけを削除してHPを表示すると、下のように、不具合は出ないで、表示は正常になります。
つまり、確かに「writeIn」が悪影響を及ぼしていることがわかります。
このように、「非推奨」の命令を 記事の最終の</body>の直上においたとしても、（私の場合は） フッターの下側にJavaScriptの結果が表示されてしまうという予期しない異常が起こりました。
またその他で、onclickをつかってJavaScriptが動くようにしてみたところ、writelnを書き入れた場合は、それまでのページが消えてしまい、全く白紙のページの冒頭に答えが表示される … などの異常が発生します。
表示がおかしくなる以外でも、何かの異常が出ている可能性もあるかもしれないので、「非推奨となっている命令は使わない」と考えておきましょう。
それら「writeｌn」や「write」使わない方法についてはこちらのページで2つの方法を実例で紹介していますので参考にしてください。
PR
ここでは、writeｌnの例を示しましたが、私が充分に関数の定義を理解していなかったことで起きた不具合をこちらのページで紹介しています。
