关于input值的获取问题

<script type="text/javascript">
        function checkna(){
            na=form1.yourname.value;
              if( na.length <1 || na.length >12)  
              {      
                  divname.innerHTML='<font class="tips_false">长度是1~12个字符</font>';
                   
              }else{  
                  divname.innerHTML='<font class="tips_true">输入正确</font>';
                 
              }  
          
      }

  </script>

<body>
    <div class="contact" >
        <form name="form1" method="post">
            
                    <label>姓名:</label>
                    <input type="text" name="yourname" placeholder="请输入用户名"  onblur="checkna()" required/><span class="tips" id="divname">长度1~12个字符</span>
            <b class="btn"><input type="submit" value="提交"/>
            <input type="reset" value="取消"/></b>
        </form>
    </div>

上面这段代码有两个不懂的的地方:JS获取input值的时候不是通过先获取ID吗??

na=form1.yourname.value;为什么我这样写也可以获取

问题2:为什么这里可以这样子获取divname.innerHTML,这里也是应该通过ID

阅读 3.1k
1 个回答

本来想找文档来着,但是找不到。。。而且也不知道这个东西叫什么。。。

但是,form是可以通过name直接获取的。而获取了form以后,它下面的域也是可以直接通过name获取的

form1.yourname
如果是单个form1, 多个yourname的情况: 就直接等价于 document.querySelector('[name=form1]').querySelectorAll('[name=yourname]')
如果都是单个的话,就等价于document.querySelector('[name=form1]')[0].querySelector('[name=yourname]')


id的情况类似,如果一个domid的话,那么可以直接通过id获取

<form name="form1" method="post" id="formId">
                <label>姓名:</label>
                <input type="text" name="yourname" placeholder="请输入用户名"  onblur="checkna()" required/><span class="tips" id="divname">长度1~12个字符</span>
        <b class="btn"><input type="submit" value="提交"/>
        <input type="reset" value="取消"/></b>
    </form>

formId 就等价于 document.querySelector("#formId")

推荐问题