javascript
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4<title>おみくじ</title>
5
6</head>
7<body>
8<h1>おみくじ</h1>
9<input type=button value="おみくじスタート" onclick="onButtonClick()">
10<div id="dsp"></div>
11
12    <script>
13       let kujis =["大吉","吉","中吉","小吉","末吉","凶","大凶"];
14       let kuji = Math.floor(Math.random()*kujis.length);
15       
16       let disp = document.getElementById("dsp");
17
18
19       function onButtonClick(){
20             dsp.innerHTML = kujis[kuji];
21             if(kuji=0){
22             dsp.style.color="red";
23             dsp.font-size:200%;
24             }
25             }
26　　
27    </script>

おみくじの結果が「大吉」のときだけ「赤文字」「文字サイズを200％」にしたいのですが、
赤文字にもならず文字サイズも大きくなりません。
どこに問題があるのでしょうか。よろしくお願いします。

行動規範の内容に同意します

回答2件

ベストアンサー

二点ほど。

javascript
1if(kuji=0){
2  // 省略
3}

これのif文の箇所は比較ではなく、代入式になっているからです。
kuji変数に0が代入され、その値、0が評価されるので、その条件は一生通りません。
==と、二つにしましょう。そうすれば、0の時通るようになります。

javascript
1dsp.font-size:200%;

に関して。
CSSと同じ文法になっているので、
100%エラーになります。
その前行にならって同じように指定してください。

javascript
1dsp.style.fontSize = "200%";

また、下記の方がスタイルが効くかもしれないです。

javascript
1dsp.style.fontSize = "2em";

コメントの、スタイルが一度変わると、その後変わらない件

これも二点あります。

まず、kuji変数が一度定義されて、その後変更していないからです。

ようは、いくらonButtonClickを実行しても、kuji変数の中身を変更しないような処理となっているので、
変わりようがないです。
onButtonClickの実行時にkujiを変えるように、処理を変更しましょう。

二点目は、一回スタイルを変更した後、kuji変数を変えたとしても、一度当てたスタイルを解除するようにはなっていないので、解除する処理を入れねばなりません。

上記二点は、処理のキモとなるため、ご自身でまず処理を書いてみてください。
（これ以上は作業依頼に答える形になってしまいます。）

投稿2020/05/02 07:56

編集2020/05/03 03:23

miyabi_pudding

総合スコア9555

m.ts10806

2020/05/02 09:39

VB、VBAとかですね。=で比較あれはあれで他の言語やってからだと分からなくなる。

miyabi_pudding

2020/05/02 12:03

そ、そうなんですか・・・！情報、ありがとうございます！

beginner001

2020/05/03 02:38

ありがとうございます。以下のように直して実行したら、大吉だけでなく「吉」も赤文字になってしまいます。また文字サイズに変化はありません。 function onButtonClick(){ dsp.innerHTML = kujis[kuji]; if(kuji==0){ dsp.style.color= "red"; dsp.style.fontSize = "200%"; } }

miyabi_pudding

2020/05/03 03:01 編集

そうですね、要件は、文字を大きくしたいなので、毎回スタイル変わってしまう〜というのは要件に含まれてないので・・・。質問本文に、そのことも含めていただけませんか？？文字の大きさに関しては、 dsp.style.fontSize = "2em"; に変えてみてください。

beginner001

2020/05/03 04:08

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

行動規範の内容に同意します