document.getElementsByName()的用法

getElementById(), getElementsByName()与getElementsByTagName()的用法比较!

<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>
<html>
 <head>
  <title>Login title here</title>
 </head>
 
 <body>
   <form id ="form1" action="test.do" method="post">
    <input type="text" name="a" value="1">
    <br>
    <input type="text" name="a" value="2">
    <br>
    <input type="text" name="a" value="3">
    <br>
    <input  type="submit" value="提交">
   </form> 

 </body>
        <script type="text/javascript">
         document.getElementById('form1').onsubmit=function(){
        
         var as=document.getElementsByName('a');
      for(i=0;i<as.length;i++){
      alert(as[i].value);
      }
     }
    </script>
</html>

//==================上面的是HTML与JS把分离的代码(怎么样不用onclick 来触发submit按钮的书写过程)!可以把js代码写在form上面吗?

<%@ page language="java" contentType="text/html" pageEncoding="utf-8"%>
<html>
 <head>
  <title>Login title here</title>
 </head>
 
      <script type="text/javascript">
          function put(){
          //下面是根据id拿值
          //  var a1=document.getElementById("e").value;
          //alert(a1)
         
         //下面是根据Name拿值,拿的是一个集合数组
           //  var as=document.getElementsByName('a');
     //  for(i=0;i<as.length;i++){
     //  alert(as[i].value);
       
      //下面是根据tagName拿值,也是拿的一个数组
     
        var as=document.getElementsByTagName("input");
       for(i=0;i<as.length;i++){
       alert(as[i].value);
     
      }
     }
    </script>
 
 <body>
   <form id ="form1" action="test.do" method="post">
    <input id="e" type="text" name="a" value="1">
    <br>
    <input type="text" name="a" value="2">
    <br>
    <input type="text" name="a" value="3">
    <br>
    <input  type="submit" value="提交" onclick="put();">
   </form> 

 </body>
  
</html>

 

下面是别人总结的:

http://hi.baidu.com/notebook034/blog/item/567bcffe2a3dfa345c6008c8.html

你可能感兴趣的:(JavaScript,html,Blog)