###前提・実現したいこと
HTMLでjavascriptを使って、三目並べを作りたいのですが’○’,'×'が表示されません。どのようにしたら表示されますか。
(*tableタグは使いません。)
###該当のソースコード
HTML
1 2<!DOCTYPE html> 3<html> 4 5<head> 6 <meta charset="UTF-8"> 7 <script src="./Tick-Tack-Toe.js"></script> 8 <link rel="stylesheet" href="./Tick-Tack-Toe.css"> 9</head> 10 11<body> 12 <div id="block"> 13 <button id="b0">b0</button> 14 <button id="b1">b1</button> 15 <button id="b2">b2</button> 16 <button id="b3">b3</button> 17 <button id="b4">b4</button> 18 <button id="b5">b5</button> 19 <button id="b6">b6</button> 20 <button id="b7">b7</button> 21 <button id="b8">b8</button> 22 <div id="result"></div> 23 </div> 24</body> 25 26</html> 27 28 29 30 31 32 33
javascript
1window.addEventListener('load', function () { 2 3 var button = document.getElementById('b0'); 4 var button = document.getElementById('b1'); 5 var button = document.getElementById('b2'); 6 var button = document.getElementById('b3'); 7 var button = document.getElementById('b4'); 8 var button = document.getElementById('b5'); 9 var button = document.getElementById('b6'); 10 var button = document.getElementById('b7'); 11 var button = document.getElementById('b8'); 12 var result = document.getElementById('result'); 13 button.InnerText = "InnerText"; 14 var count = 0; 15 16 b0.addEventListener('click', function () { 17 var ret = judge(); 18 if (ret) { 19 alert(ret); 20 } 21 }) 22 b1.addEventListener('click', function () { 23 var ret = judge(); 24 if (ret) { 25 alert(ret); 26 } 27 }) 28 b2.addEventListener('click', function () { 29 var ret = judge(); 30 if (ret) { 31 alert(ret); 32 } 33 }) 34 b3.addEventListener('click', function () { 35 var ret = judge(); 36 if (ret) { 37 alert(ret); 38 } 39 }) 40 b5.addEventListener('click', function () { 41 var ret = judge(); 42 if (ret) { 43 alert(ret); 44 } 45 }) 46 b6.addEventListener('click', function () { 47 var ret = judge(); 48 if (ret) { 49 alert(ret); 50 } 51 52 }) 53 b7.addEventListener('click', function () { 54 var ret = judge(); 55 if (ret) { 56 alert(ret); 57 } 58 }) 59 b8.addEventListener('click', function () { 60 var ret = judge(); 61 if (ret) { 62 alert(ret); 63 } 64 }) 65 if (count % 2 === 0) { 66 var mark = "◯"; 67 } else { 68 var mark = "✕"; 69 } 70 button.InnerText = mark; 71 count++; 72 function judge() { 73 var winer = null; 74 if (b0 == b1 && b1 == b2 && b0 != "") { 75 winer = c0; 76 } else if (b3 == b4 && b4 == b5 && b3 != "") { 77 winer = b3; 78 } else if (b6 == b7 && b7 == b8 && b6 != "") { 79 winer = b6; 80 } else if (b0 == b3 && b3 == b6 && b0 != "") { 81 winer = b0; 82 } else if (b1 == b4 && b4 == b7 && b1 != "") { 83 winer = b1; 84 } else if (b2 == b5 && b5 == b8 && b2 != "") { 85 winer = b2; 86 } else if (b0 == b4 && b4 == b8 && b0 != "") { 87 winer = b0; 88 } else if (b2 == b4 && b4 == b6 && b2 != "") { 89 winer = b2; 90 } 91 92 var str; 93 if (winer) { 94 str = winer + "の勝ちです。"; 95 } else if (count == 9) { 96 str = "引分けです。"; 97 } else { 98 str = null; 99 } 100 return str;; 101 } 102});
###該当のソースコード
css
1body{ 2 background-color: black; 3} 4 5div { 6 margin: 235px; 7 width: 200px; 8 height: 300px; 9 text-align: content; 10} 11button { 12 width: 60px; 13 height: 60px; 14 font-size: 20px; 15}```ここに言語を入力 16コード
###試したこと 課題に対してアプローチしたことを記載してください ###補足情報(言語/FW/ツール等のバージョンなど) より詳細な情報