<![CDATA[
<div class="figure-html" data-ke-type="html" data-source="<div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">!DOCTYPE</span>&nbsp;<span style="color:#a8ff58">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">html</span>&nbsp;<span style="color:#a8ff58">lang</span>=<span style="color:#ffd500">"ko"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">charset</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">http-equiv</span>=<span style="color:#ffd500">"X-UA-Compatible"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"IE=edge"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"viewport"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"width=device-width,&nbsp;initial-scale=1.0"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">&gt;</span>숫자&nbsp;맞추기숙제<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">link</span>&nbsp;<span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ffd500">'use&nbsp;strict'</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">let</span>&nbsp;su1&nbsp;;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">let</span>&nbsp;su2&nbsp;;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">let</span>&nbsp;random&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"1"</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">let</span>&nbsp;res&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"2"</span>&nbsp;;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">function</span>&nbsp;start(){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;su1&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#4be6fa">parseInt</span>(<span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">getElementById</span>(<span style="color:#ffd500">"su1"</span>).value);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;su2&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#4be6fa">parseInt</span>(<span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">getElementById</span>(<span style="color:#ffd500">"su2"</span>).value);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">if</span>(su1<span style="color:#aaffaa"></span><span style="color:#ff3399">&gt;</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>su2){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">alert</span>(<span style="color:#ffd500">"최소&nbsp;최대값을&nbsp;정확히&nbsp;적어주세요"</span>)</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">return</span>&nbsp;<span style="color:#c10aff">false</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;random&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;rand(su1,su2);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;res&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;rand(su1,su2);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;demo1.innerHTML&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"랜덤값&nbsp;:&nbsp;"</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;random;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;demo2.innerHTML&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"당신의값&nbsp;:&nbsp;"</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;res;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;p.innerHTML&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ffd500">"&lt;p&gt;방향키&nbsp;위아래키로&nbsp;숫자를&nbsp;맞춰보세요~&lt;/p&gt;&lt;p&gt;↑는&nbsp;+1&nbsp;&lt;br/&gt;↓는&nbsp;-1&nbsp;입니다~&lt;/p&gt;"</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">function</span>&nbsp;rand(min,&nbsp;max)&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">return</span>&nbsp;Math.floor(Math.random()&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">*</span>&nbsp;(max&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">-</span>&nbsp;min&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;<span style="color:#c10aff">1</span>))&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;min;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">function</span>&nbsp;keyboardEvent(e){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">let</span>&nbsp;str&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"발생된&nbsp;이벤트&nbsp;:&nbsp;"</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>e.type&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;<span style="color:#ffd500">"&lt;br/&gt;"</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">if</span>(e.which<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#c10aff">38</span>){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;res&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span><span style="color:#c10aff">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;demo2.innerHTML&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"당신의&nbsp;값&nbsp;:&nbsp;"</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;res;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">if</span>(e.which<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#c10aff">40</span>){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;res&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">-</span><span style="color:#c10aff">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;demo2.innerHTML&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"당신의&nbsp;값&nbsp;:&nbsp;"</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>&nbsp;res;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">if</span>(random<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>res){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;demo1.innerHTML&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;<span style="color:#ffd500">"게임성공!!!"</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">xxonkeypress</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;keyboardEvent;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">xxonkeydown</span>&nbsp;<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>&nbsp;keyboardEvent;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span>&nbsp;<span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"container"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">h2</span><span style="color:#f0f0f0">&gt;</span>숫자&nbsp;맞추기<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">h2</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span>&nbsp;<span style="color:#a8ff58">id</span>&nbsp;<span style="color:#a8ff58"></span>=<span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">p</span><span style="color:#f0f0f0">&gt;</span>원하는&nbsp;숫자의&nbsp;범위를&nbsp;입력해보세요~<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">form</span>&nbsp;<span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"myform"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;최소값</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">input</span>&nbsp;<span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"number"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"su1"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"su1"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;최대값</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">input</span>&nbsp;<span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"number"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"su2"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"su2"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span>&nbsp;<span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"demo1"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;랜덤값&nbsp;:&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span>&nbsp;<span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"demo2"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;당신의&nbsp;값&nbsp;:</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">input</span>&nbsp;<span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"button"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">value</span>=<span style="color:#ffd500">"시작하기"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">xxonclick</span>=<span style="color:#ffd500">"start()"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"btn&nbsp;btn-primary"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">input</span>&nbsp;<span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"button"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">value</span>=<span style="color:#ffd500">"다시하기"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">xxonclick</span>=<span style="color:#ffd500">"location.reload();"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"btn&nbsp;btn-success"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">hr/</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">form</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">hr/</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">&gt;</span></div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div>"><div data-ke-class="article"><div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">!DOCTYPE</span> <span style="color:#a8ff58">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">html</span> <span style="color:#a8ff58">lang</span>=<span style="color:#ffd500">"ko"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">charset</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">http-equiv</span>=<span style="color:#ffd500">"X-UA-Compatible"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"IE=edge"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"viewport"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"width=device-width, initial-scale=1.0"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">></span>숫자 맞추기숙제<span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">link</span> <span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.slim.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ffd500">'use strict'</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">let</span> su1 ;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">let</span> su2 ;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">let</span> random <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"1"</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">let</span> res <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"2"</span> ;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">function</span> start(){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> su1 <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#4be6fa">parseInt</span>(<span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">getElementById</span>(<span style="color:#ffd500">"su1"</span>).value);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> su2 <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#4be6fa">parseInt</span>(<span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">getElementById</span>(<span style="color:#ffd500">"su2"</span>).value);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">if</span>(su1<span style="color:#aaffaa"></span><span style="color:#ff3399">></span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>su2){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">alert</span>(<span style="color:#ffd500">"최소 최대값을 정확히 적어주세요"</span>)</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">return</span> <span style="color:#c10aff">false</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> random <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> rand(su1,su2);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> res <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> rand(su1,su2);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> demo1.innerHTML <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"랜덤값 : "</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> random;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> demo2.innerHTML <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"당신의값 : "</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> res;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> p.innerHTML <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"<p>방향키 위아래키로 숫자를 맞춰보세요~</p><p>↑는 +1 <br/>↓는 -1 입니다~</p>"</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">function</span> rand(min, max) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">return</span> Math.floor(Math.random() <span style="color:#aaffaa"></span><span style="color:#ff3399">*</span> (max <span style="color:#aaffaa"></span><span style="color:#ff3399">-</span> min <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> <span style="color:#c10aff">1</span>)) <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> min;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">function</span> keyboardEvent(e){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">let</span> str <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"발생된 이벤트 : "</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span>e.type <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> <span style="color:#ffd500">"<br/>"</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">if</span>(e.which<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#c10aff">38</span>){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> res <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span><span style="color:#c10aff">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> demo2.innerHTML <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"당신의 값 : "</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> res;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">if</span>(e.which<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#c10aff">40</span>){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> res <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">-</span><span style="color:#c10aff">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> demo2.innerHTML <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"당신의 값 : "</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">+</span> res;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">if</span>(random<span style="color:#aaffaa"></span><span style="color:#ff3399">=</span><span style="color:#aaffaa"></span><span style="color:#ff3399">=</span>res){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> demo1.innerHTML <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> <span style="color:#ffd500">"게임성공!!!"</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">xxonkeypress</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> keyboardEvent;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">document</span>.<span style="color:#4be6fa">xxonkeydown</span> <span style="color:#aaffaa"></span><span style="color:#ff3399">=</span> keyboardEvent;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span> <span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"container"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">h2</span><span style="color:#f0f0f0">></span>숫자 맞추기<span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">h2</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span> <span style="color:#a8ff58">id</span> <span style="color:#a8ff58"></span>=<span style="color:#a8ff58"></span> <span style="color:#a8ff58">p</span><span style="color:#f0f0f0">></span>원하는 숫자의 범위를 입력해보세요~<span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">form</span> <span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"myform"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> 최소값</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">input</span> <span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"number"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"su1"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"su1"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> 최대값</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">input</span> <span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"number"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"su2"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"su2"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span> <span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"demo1"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> 랜덤값 : </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span> <span style="color:#a8ff58">id</span>=<span style="color:#ffd500">"demo2"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> 당신의 값 :</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">input</span> <span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"button"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">value</span>=<span style="color:#ffd500">"시작하기"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">xxonclick</span>=<span style="color:#ffd500">"start()"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"btn btn-primary"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">input</span> <span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"button"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">value</span>=<span style="color:#ffd500">"다시하기"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">xxonclick</span>=<span style="color:#ffd500">"location.reload();"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"btn btn-success"</span><span style="color:#a8ff58">/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">hr/</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">form</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">hr/</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">></span></div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div></div></div><div class="figure-video" data-ke-type="video" data-video-url="https://kakaotv.daum.net/embed/player/cliplink/rvw44cdo1oe5gotr578zw3a5y@my?service=daum_cafe" data-video-host="kakaotv" data-video-play-service="daum_cafe" data-video-width="712" data-video-height="400" data-ke-style="alignCenter" data-video-thumbnail="https://thumb.kakaocdn.net/dna/kamp/source/rvw44cdo1oe5gotr578zw3a5y/thumbs/2.jpg?credential=TuMuFGKUIcirOSjFzOpncbomGFEIdZWK&expires=33224806940&signature=3leD4EbD%2BfMdz9M5uhhX8N0VjZU%3D" data-ke-mobile-mobileStyle="widthFull" data-video-origin-width="712" data-video-origin-height="400"><iframe src="https://kakaotv.daum.net/embed/player/cliplink/rvw44cdo1oe5gotr578zw3a5y@my?service=daum_cafe&ptoken=v2_861ce7d4eed574bb6a35b14b69b91b7a1885a4e321b1c41d34248e1dea3f307851e8bff34d66cdbe1ea29ddffc70821632fe4216a3bce03d384ff3b019" width="712" height="400" frameborder="0" scrolling="no" allowfullscreen="" allow="encrypted-media"></iframe><div class="figcaption"></div></div>
<!-- -->]]>
카페 게시글
검색이 허용된 게시물입니다.
박재혁
[1108]숙제1 방향키로 랜덤한 숫자맞추기 바꾸기 게임
박재혁
추천 0
조회 53
22.11.08 18:02
댓글 1
다음검색
첫댓글 내용 좋네요.. 수고하셨습니다.