2020 ソフトウェア設計及び演習用の班Wiki
20::gr09::鈴木直揮::メモ::javascriptに対しての愚痴::答え
9班wiki > 鈴木直揮 > メモ > javascriptに対しての愚痴の答え
答え
入力欄やボタンが表示されますが、実行ボタンを推してもpタグには何も起きません！
それじゃあ、何か打ち込み間違っていたりバグってる筈だから、F12で出てくるコンソールでエラーが出てくる筈ですね？
出ません！！！マジでクソ
適当な解説
このjavascriptは
var bmi = w / (h * h);
の行まではちゃんと動いています。問題は次の行です。
document.getElementById("bmi").textcontent = "BMIは" + bmi + "です";
document.getElementById("bmi")でidがbmiのhtmlタグの部分を持ってきて、そのプロパティのtextcontentに文字列を代入・・・気づきましたか？
本来はtext"C"ontentになる筈の部分がtext"c"ontentになってます。なので元々テキストを代入したかったtext"C"ontentには何も入ってないので実行ボタンを押しても虚無が表示されたという事らしいです。
何でエラーがコンソールに出ないの！！！（全ギレ）
多少コンソールを弄ってデバッグした事を元にした推測なので、色々と調べた訳じゃないので正確な事は分からないです。下にあるのは、エラーがコンソールに出ない理由が一番分かりやすいだろうサンプルプログラムです。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>BMI計算</title>
<script>
function calc_bmi() {
var h = document.getElementById("height").value;
var w = document.getElementById("weight").value;
var bmi = w / (h * h);
document.getElementById("bmi").textcontent = "BMIは" + bmi + "です";
console.log(document.getElementById("bmi").textcontent);
}
</script>
</head>
<body>
<h1>BMI計算</h1>
身長[m]: <input id="height" /><br />
体重[kg]: <input id="weight" /><br />
計算: <button onClick="calc_bmi()">実行</button>
<p id="bmi"></p>
</body>
</html>
これを実行するとさっきのプログラムのように画面の方は何も起こらないけれど、F12を押した時に出るコンソールの方にはちゃんと表示される筈だったBMIが表示されている筈です。
document.getElementByIdやjavascriptの挙動は良く分からないのですが、勝手にプロパティを生やす事が出来るみたいです。エラーが出る筈が無いですね。（困惑）
そもそも
javascriptはどうやらキャメルケース（単語と単語の境目を後の単語の頭文字を大文字にする事によって表す）を良く使う言語らしいです。今まで学んできたC言語では割とスネークケース（単語と単語の間にアンダーバーを入れる）が多かったのでjavascriptを書く時もその癖が出てしまったみたいです。または普通にシフトを押し忘れてたのか・・・。
最終更新日：2020/06/19 12:28:26
