js中获取表单/dom对象的方法

简介: js中获取表单/dom对象的方法

HTML部分

<form>
            <input  type="text"  value="请输入用户名" id=”number”><br />
            <input type=" button"   value="提交"  οnclick="checkForm()">
    </form>
JS部分

方法1:

<script>
        funciton checkForm(){
        var obj=document.getElementById("number").value;
        alert(obj)
       }
</script>

方法2:

<form id ="form1"  name=”form1”>
        代号:<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(){   // div.οnclick=function(){}
         var as=document.getElementsByName('a');  //数组
        for(i=0; i<as.length;i++){
          alert(as[i].value);
         }
       }
    </script>

方法3:

<script>
        funciton checkForm(){
             var obj=document.form1.number.value;
             var obj=document.forms[0].number.value;//
             var obj=document.forms[0]['number'].value;
             var obj=document.form1['number'].value;
       }
</script>

DOM寻址方法:

getElementById  

getElementsByName

getElementsByTagName

getElementsByClassName

目录
相关文章
|
9月前
|
JavaScript 前端开发 API
JavaScript中通过array.map()实现数据转换、创建派生数组、异步数据流处理、复杂API请求、DOM操作、搜索和过滤等,array.map()的使用详解(附实际应用代码)
array.map()可以用来数据转换、创建派生数组、应用函数、链式调用、异步数据流处理、复杂API请求梳理、提供DOM操作、用来搜索和过滤等,比for好用太多了,主要是写法简单,并且非常直观,并且能提升代码的可读性,也就提升了Long Term代码的可维护性。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
缓存 编解码 JavaScript
DOM 和 BOM 在项目中应用时的性能优化方法
【10月更文挑战第19天】总之,优化 DOM 和 BOM 的性能需要综合考虑多个方面,通过合理的设计和技术手段,提升项目的运行效率和用户体验。在实际开发中,要不断地进行性能优化实践,以适应不断变化的需求和技术发展。
310 63
|
JavaScript 前端开发 索引
js中DOM的基础方法
【10月更文挑战第31天】这些DOM基础方法是操作网页文档结构和实现交互效果的重要工具,通过它们可以动态地改变页面的内容、样式和行为,为用户提供丰富的交互体验。
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
466 5
ractive.js联系表单动画效果源码
一款ractive.js联系表单动画效果,很有创意的发送邮件、联系内容等表单,基于ractive.js实现的动画效果,以发送信件的方式。
125 1
|
前端开发 JavaScript 安全
HTML+CSS+JS密码灯登录表单
通过结合使用HTML、CSS和JavaScript,我们创建了一个带有密码强度指示器的登录表单。这不仅提高了用户体验,还帮助用户创建更安全的密码。希望本文的详细介绍和代码示例能帮助您在实际项目中实现类似功能,提升网站的安全性和用户友好性。
228 3
|
JavaScript 前端开发 开发者
.js的dom元素操作
【10月更文挑战第29天】通过灵活运用这些 DOM 元素操作方法,JavaScript 可以实现丰富的网页交互效果,如动态更新页面内容、响应用户操作、创建和删除页面元素等。在实际开发中,开发者可以根据具体的需求和场景,选择合适的 DOM 元素操作方法来实现所需的功能,为用户提供更加流畅和动态的网页体验。
|
JavaScript 前端开发 API
|
JavaScript 前端开发 数据安全/隐私保护
|
JavaScript 前端开发 数据安全/隐私保护