如何用 document.getElementsByTagName()取到每个元素名称,并打印出来呢?


以下代码,可以得到元素的数量,但是,我想依次打印出来,如何实现呢?
<html>
<head>
<script type="text/javascript">
function getElements()
  {
  var x=document.getElementsByTagName("input");
  
  alert(x.length);
  }
</script>
</head>
<body><input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()"
value="How many input elements?" /></body>
</html>

解决方案 »

  1.   


    <html>
    <head>
    <script type="text/javascript">
    function getElements()
      {
      var x=document.getElementsByTagName("input");
      
      alert(x.length);
      }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" /></body>
    </html>
      

  2.   


    <html>
    <head>
    <script type="text/javascript">
    function getElements()
    {
      var x=document.getElementsByTagName("input");
      for(var i=0;i<x.length;i++){
          alert(x[i].value);
      }
    }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" value="1"/><br />
    <input name="myInput" type="text" size="20" value="2" /><br />
    <input name="myInput" type="text" size="20" value="3" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" /></body>
    </html>
      

  3.   

    <html>
    <head>
    <script type="text/javascript">
    function getElements()
      {
      var x=document.getElementsByName("myInput");
      for (i  = 0; i < x.length; i ++) alert(x[i].value);
      }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" /></body>
    </html>是这样吗？
      

  4.   

    这样为何不行呢,一点按钮,表单上的控件全没了呀?
    <html>
    <head>
    <script type="text/javascript">
    function getElements()
      {
      var x=document.getElementsByTagName("input");
        for (var i  = 0; i < x.length; i ++) {
    document.write(x[i].value);
    }
      }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" /></body>
    </html>
      

  5.   

    <html>
    <head>
    <script type="text/javascript">
    function getElements()
      {
      var x=document.getElementsByTagName("input");
        for (var i  = 0; i < x.length; i ++) {
            document.getElementById("info").innerHTML+=x[i].value+"<br />";
        }
      }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" value="a" /><br />
    <input name="myInput" type="text" size="20" value="b" /><br />
    <input name="myInput" type="text" size="20" value="c" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" />
    <div id="info"></div>
    </body>
    </html>
      

  6.   

    文档树生成之后不能再用document.write了,那样做就是生成一个全新的文档去覆盖原先的文档.
    你可以按照楼上这样做.或者
    document.body.appendChild(.....);
      

  7.   

    appendChild方法:
    顺便提一下,这个方法是相当繁琐的.<html>
    <head>
    <script type="text/javascript">
        function getElements() {
            var docFra = document.createDocumentFragment();
            var x = document.getElementsByTagName("input");
            for (var i = 0; i < x.length; i++) {
                var textNode = document.createTextNode(x[i].value);
                var divNode = document.createElement("p");
                divNode.appendChild(textNode);
                docFra.appendChild(divNode);
            }
            document.body.appendChild(docFra);
        }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" /></body>
    </html>
      

  8.   

    直接利用循环，十分简单
    楼主，你究竟想打印些什么出来，是想打印对象出来还是标签的值呢<script type="text/javascript">
    function getElements() {
          var x = document.getElementsByTagName("input");
          for (var i = 0; i < x.length; i++) {
              //输出文本框的值
              alert(x[i].value);
              //输出文本框的name属性
              alert(x[i].name);
          }
      }
    </script>
      

  9.   


    <html>
    <head>
    <script type="text/javascript">
    function getElements()
      {
      var x=document.getElementsByTagName("input");
      var y=’’;
        for (var i  = 0; i < x.length; i ++) {
            y +=','+x[i].value;
        }
    document.write(y);
      }
    </script>
    </head>
    <body><input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <input name="myInput" type="text" size="20" /><br />
    <br />
    <input type="button" onclick="getElements()"
    value="How many input elements?" /></body>
    </html>