DOM 이벤트 비밀 탐지 (2) 이벤트 유형

    


    
    


    
    


    


function getByClass(clsName, parent) {
    var oParent = parent ? document.getElementById(parent) : document,
        eles = [],
        elements = oParent.getElementsByTagName('*');

    for (var i = 0, l = elements.length; i < l; i++) {
        if (elements[i].className == clsName) {
            eles.push(elements[i]);
        }
    }
    return eles;
}
var p=getByClass("bon_com")[0];
p.innerHTML="d";
</code></pre> 
 <p>     ，<code>getByClass</code>        ，    <code>class</code>  ，         <code>id</code>  id    ，       <code>document</code>  id  <code>document</code>，  <code>elements</code>    id      ，         <code>class</code> ，  <code>push</code> <code>eles</code>   ，     <code>return eles;</code>          <code>class</code>   。</p> 
 <h4>1.        </h4> 
 <blockquote> 
  <p>   </p> 
 </blockquote> 
 <div class="image-package"> 
  <div class="image-container" style="max-width: 700px; max-height: 644px;"> 
   <div class="image-view"> 
    <a href="https://img.  .com/image/info10/0abc823325e84fb4a801364304536922.gif" target="_blank"><img src="https://img.  .com/image/info10/0abc823325e84fb4a801364304536922.gif" width="1021" height="644" alt="DOM    (2)    _ 1   " style="border:1px solid black;"></a> 
   </div> 
  </div> 
  <div class="image-caption">
    tuozuai.gif 
  </div> 
 </div> 
 <blockquote> 
  <p>    </p> 
 </blockquote> 
 <ol> 
  <li>                     。</li> 
  <li>       </li> 
  <li>         </li> 
 </ol> 
 <p><strong>                     </strong></p> 
 <p>           ，         <br>      <code>onmousedown</code>  ，  <code>fnDown</code>  。</p> 
 <p><strong>       </strong></p> 
 <p>            ，       <code>onmousemove</code>             <code>onmousemove</code>  ，    <code>box</code> <code>clientX</code> <code>clientY</code>    。</p> 
 <p><strong>         </strong></p> 
 <p>     <code>onmouseup</code> <code>onmousemove</code>   。</p> 
 <pre><code>document.onmousemove=null;
</code></pre> 
 <h4>1.      </h4> 
 <div class="image-package"> 
  <div class="image-container" style="max-width: 665px; max-height: 529px;"> 
   <div class="image-view"> 
    <a href="https://img.  .com/image/info10/550bb97b90884ec68994c9647a7c5db7.gif" target="_blank"><img src="https://img.  .com/image/info10/550bb97b90884ec68994c9647a7c5db7.gif" width="665" height="529" alt="DOM    (2)    _ 2   " style="border:1px solid black;"></a> 
   </div> 
  </div> 
  <div class="image-caption">
    tuozuai1.gif 
  </div> 
 </div> 
 <p>     ，             ，        <code>li</code>         ，            ，                  。             。</p> 
 <blockquote> 
  <p>    (  )</p> 
 </blockquote> 
 <p>    ：http://www.huanghanlian.com/DOM_Event_demo/keyEvent/</p> 
 <ol> 
  <li> <code>keyDown</code>              ，                 。</li> 
  <li> <code>keyPress</code>            ，               。</li> 
  <li> <code>keyUp</code>              。</li> 
 </ol> 
 <p>        ，    ，        ，     ，  <code>setInterval()</code>   ，      20          ，           50  <code>Math.random()</code>     ，<code>Math.random()</code>          0，  1    ，             ，     8   ，     0-7   ，  <code>8*0  0</code>        ，<code>8*0.99   8</code>               <code>length</code>   <code>Math.floor()</code>            0-7   ，                            。</p> 
 <p>         ，</p> 
 <pre><code>var flag = 0;
//     
document.onkeyup = function(event) {
  event = event || window.event;
  if (event.keyCode == 13) {
    if (flag == 0) {
      playFun();
      flag = 1;
    } else {
      stopFun();
      flag = 0;
    }
  }
}
</code></pre> 
 <p>  <code>flag</code> 0   false</p> 
 <p>       <code>onkeyup</code>    ，        ，        <code>flag</code> 0   false，       ，  <code>flag</code>  1   true，       <code>onkeyup</code>      ，  <code>flag</code> 1         。               ，      ......</p> 
</article>
                            </div>
                        </div>
                    </div>
                    <!--PC WAP    -->
                    <div id="SOHUCS" sid="1245797329282387968"></div>
                    <script type="text/javascript" src="/views/front/js/chanyan.js">