zoukankan      html  css  js  c++  java
  • DOM查询

    getElementById() 通过id属性获取一个元素节点对象
    getElementsByTagName() 通过标签名获取一组元素节点对象
    getElementsByName() 通过name属性获取一组元素节点对象



     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4     <meta charset="UTF-8">
     5     <title></title>
     6 </head>
     7 <script type="text/javascript">
     8         window.onload=function(){
     9             var a=document.getElementById("2");
    10             a.onclick=function(){
    11                 var li=document.getElementsByTagName("li");
    12                 for(var i=0;i<li.length;i++)
    13                 {
    14                 alert(li[i].innerHTML);
    15                 }
    16             }
    17             var b=document.getElementById("3");
    18             b.onclick=function(){
    19             var inputs=document.getElementById("22");
    20             alert(inputs.innerHTML);
    21             }
    22             var c=document.getElementById("4");
    23             c.onclick=function(){
    24             var inputs=document.getElementsByName("gender");
    25             for(var i=0;i<inputs.length;i++)
    26             {
    27               alert(inputs[i].name);
    28               alert(inputs[i].value);
    29               alert(inputs[i].className);
    30             }
    31             }
    32                     };
    33     </script>
    34 
    35 <body>
    36 <!--
    37 getElementById() 通过id属性获取一个元素节点对象
    38 getElementsByTagName() 通过标签名获取一组元素节点对象
    39 getElementsByName() 通过name属性获取一组元素节点对象
    40 -->
    41 <div>
    42     <ul>
    43         <li id="22">12</li>
    44         <li>23</li>
    45     </ul>
    46     <input type="button" id="2" value="1"/>
    47     <input type="button" id="3" value="2"/>
    48     <input type="button" id="4" value="3" >
    49 
    50     gender:
    51     <input type="radio" name="gender" class="i am class" value="m"/>
    52     male
    53     <input type="radio" name="gender" value="f" />
    54     female
    55 </div>
    56 </body>
    57 </html>
  • 相关阅读:
    个人常用Git操作记录
    JavaScript引擎基本原理:Shapes和Inline Caches
    Promise.then(a, b)与Promise.then(a).catch(b)问题详解
    p标签中的文本换行
    Vue初始化
    关于vue的源码调试
    关于extjs表单布局的几种方式
    sublime text3安装、注册及常用插件
    chrome扩展程序开发
    关于Git的简单使用
  • 原文地址:https://www.cnblogs.com/zuiaimiusi/p/11241724.html
Copyright © 2011-2022 走看看