Click here for free DL of the app version that can save data.

No:825

473

←

Prev Next

→

100 square calculations
Developer User3153｜Date and time 23/6/17 19:48:58
Build time 51.148 sec｜Game capacity 3.16KB｜

Script

100マス計算

1から100までの数字が入ったマスがあります。クリックすると、その数字が合計値に加算されます。

1	2	3	4	5	6	7	8	9	10
11	12	13	14	15	16	17	18	19	20
21	22	23	24	25	26	27	28	29	30
31	32	33	34	35	36	37	38	39	40
41	42	43	44	45	46	47	48	49	50
51	52	53	54	55	56	57	58	59	60
61	62	63	64	65	66	67	68	69	70
71	72	73	74	75	76	77	78	79	80
81	82	83	84	85	86	87	88	89	90
91	92	93	94	95	96	97	98	99	100

現在の合計値：0

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>100マス計算</title>
	<style>
		body {
			background-color: #fff9c4;
			font-family: Arial, sans-serif;
			text-align: center;
		}
		
		#board {
			display: inline-block;
			margin-top: 20px;
		}
		
		#board td {
			border: 1px solid #000;
			width: 40px;
			height: 40px;
			font-size: 24px;
		}
		
		#board .even {
			background-color: #eee;
		}
		
		#result {
			margin-top: 20px;
			font-size: 32px;
		}
	</style>
	<script>
		var currentNum = 1;
		var total = 0;
		
		function fillBoard() {
			var board = document.getElementById("board");
			var rows = board.getElementsByTagName("tr");
			for (var i = 0; i < rows.length; i++) {
				var cells = rows[i].getElementsByTagName("td");
				for (var j = 0; j < cells.length; j++) {
					if (currentNum <= 100) {
						cells[j].textContent = currentNum;
						currentNum++;
					}
				}
			}
		}
		
		function calcTotal(num) {
			total += num;
			document.getElementById("result").textContent = total;
		}
		
		function init() {
			fillBoard();
			var board = document.getElementById("board");
			var rows = board.getElementsByTagName("tr");
			for (var i = 0; i < rows.length; i++) {
				var cells = rows[i].getElementsByTagName("td");
				for (var j = 0; j < cells.length; j++) {
					if (cells[j].textContent % 2 === 0) {
						cells[j].classList.add("even");
					}
					cells[j].addEventListener("click", function() {
						var num = parseInt(this.textContent);
						calcTotal(num);
					});
				}
			}
		}
	</script>
</head>
<body onload="init()">
	<h1>100マス計算</h1>
	<p>1から100までの数字が入ったマスがあります。クリックすると、その数字が合計値に加算されます。</p>
	<table id="board">
		<tr>
			<td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
			<td>6</td><td>7</td><td>8</td><td>9</td><td>10</td>
		</tr>
		<tr>
			<td>11</td><td>12</td><td>13</td><td>14</td><td>15</td>
			<td>16</td><td>17</td><td>18</td><td>19</td><td>20</td>
		</tr>
		<tr>
			<td>21</td><td>22</td><td>23</td><td>24</td><td>25</td>
			<td>26</td><td>27</td><td>28</td><td>29</td><td>30</td>
		</tr>
		<tr>
			<td>31</td><td>32</td><td>33</td><td>34</td><td>35</td>
			<td>36</td><td>37</td><td>38</td><td>39</td><td>40</td>
		</tr>
		<tr>
			<td>41</td><td>42</td><td>43</td><td>44</td><td>45</td>
			<td>46</td><td>47</td><td>48</td><td>49</td><td>50</td>
		</tr>
		<tr>
			<td>51</td><td>52</td><td>53</td><td>54</td><td>55</td>
			<td>56</td><td>57</td><td>58</td><td>59</td><td>60</td>
		</tr>
		<tr>
			<td>61</td><td>62</td><td>63</td><td>64</td><td>65</td>
			<td>66</td><td>67</td><td>68</td><td>69</td><td>70</td>
		</tr>
		<tr>
			<td>71</td><td>72</td><td>73</td><td>74</td><td>75</td>
			<td>76</td><td>77</td><td>78</td><td>79</td><td>80</td>
		</tr>
		<tr>
			<td>81</td><td>82</td><td>83</td><td>84</td><td>85</td>
			<td>86</td><td>87</td><td>88</td><td>89</td><td>90</td>
		</tr>
		<tr>
			<td>91</td><td>92</td><td>93</td><td>94</td><td>95</td>
			<td>96</td><td>97</td><td>98</td><td>99</td><td>100</td>
		</tr>
	</table>
	<p>現在の合計値：<span id="result">0</span></p>
</body>
</html>

1	2	3	4	5	6	7	8	9	10
11	12	13	14	15	16	17	18	19	20
21	22	23	24	25	26	27	28	29	30
31	32	33	34	35	36	37	38	39	40
41	42	43	44	45	46	47	48	49	50
51	52	53	54	55	56	57	58	59	60
61	62	63	64	65	66	67	68	69	70
71	72	73	74	75	76	77	78	79	80
81	82	83	84	85	86	87	88	89	90
91	92	93	94	95	96	97	98	99	100

1	2	3	4	5	6	7	8	9	10
11	12	13	14	15	16	17	18	19	20
21	22	23	24	25	26	27	28	29	30
31	32	33	34	35	36	37	38	39	40
41	42	43	44	45	46	47	48	49	50
51	52	53	54	55	56	57	58	59	60
61	62	63	64	65	66	67	68	69	70
71	72	73	74	75	76	77	78	79	80
81	82	83	84	85	86	87	88	89	90
91	92	93	94	95	96	97	98	99	100

1	2	3	4	5	6	7	8	9	10
11	12	13	14	15	16	17	18	19	20
21	22	23	24	25	26	27	28	29	30
31	32	33	34	35	36	37	38	39	40
41	42	43	44	45	46	47	48	49	50
51	52	53	54	55	56	57	58	59	60
61	62	63	64	65	66	67	68	69	70
71	72	73	74	75	76	77	78	79	80
81	82	83	84	85	86	87	88	89	90
91	92	93	94	95	96	97	98	99	100