js获取form的方法

 更新时间:2015年05月06日 12:43:50   作者:kinmin2012  
这篇文章主要介绍了js获取form的方法,实例分析了javascript操作form表单的技巧,需要的朋友可以参考下

本文实例讲述了js获取form的方法。分享给大家供大家参考。具体如下:

先来看下面代码:

<html> 
<head> 
<scirpy> 
window.onload=function(){ 
   var f1=document.f1; 
   var f2=document.forms[1]; 
 alert(f2.id); 
  var f3=document.forms['f1']; 
} 
</script> 
</head> 
<body> 
<form id="f1" value="f1"></from> 
<from id="f2" value="f2"></form> 
</body> 
</html>

操作表单:

<html> 
 <head> 
 <script> 
  function checkform(f){ 
  var uname=f.username; 
  var pwd=f.password; 
  if(uname.value.length<4){ 
  alert('用户长度必须大于4'); 
  return false; 
  } 
  if(pwd.value.length!=6){ 
  alert('用户密码必须大于 6位'); 
  return false; 
  } 
  return true; 
  } 
 </script> 
 </head> 
 <body> 
 <form id="f1" name="f1" method="post" action=""
 onsubmit="return checkform(this)"> 
   <input name="username" value="" /></br> 
  <input name="password" value="" /></br> 
  <input type="button" value="提交" />  
 </form> 
 </body> 
</html>

js操作form的三种方式:

1. 利用表单在文档中的索引或表单的name属性来引用表单

复制代码 代码如下:
document.forms[i]  //得到页面中的第i个表单
document.forms[fromName] //得到页面中相应name的表单

2. 利用表单的id属性

复制代码 代码如下:
document.getElementById(formId);

3.

复制代码 代码如下:
document.formName;//最为常用的一种方式

希望本文所述对大家的javascript程序设计有所帮助。

相关文章

  • 简单使用webpack打包文件的实现

    简单使用webpack打包文件的实现

    这篇文章主要介绍了简单使用webpack打包文件的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-10-10
  • JS获取页面窗口大小的代码解读

    JS获取页面窗口大小的代码解读

    本节实例给出一个获取浏览器当前窗口大小的方法。当浏览器窗口大小变化时,显示的值会随时变化
    2011-12-12
  • Json格式详解

    Json格式详解

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式,这些特性使JSON成为理想的数据交换语言。易于人阅读和编写,同时也易于机器解析和生成
    2021-11-11
  • SVG动画vivus.js库使用小结(实例代码)

    SVG动画vivus.js库使用小结(实例代码)

    本文通过代码给大家介绍SVG动画vivus.js库使用小结,代码简单易懂,非常不错,具有参考借鉴价值,需要的朋友参考下吧
    2017-09-09
  • JS事件在IE与FF中的区别详细解析

    JS事件在IE与FF中的区别详细解析

    这篇文章主要是对JS事件在IE与FF中的区别进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • 使用js判断TextBox控件值改变然后出发事件

    使用js判断TextBox控件值改变然后出发事件

    这篇文章主要介绍了使用js判断TextBox控件值改变然后出发事件。需要的朋友可以过来参考下,希望对大家有所帮助
    2014-03-03
  • 小程序富文本提取图片可放大缩小

    小程序富文本提取图片可放大缩小

    这篇文章主要为大家详细介绍了小程序富文本提取图片可放大缩小,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-05-05
  • JS实现颜色梯度与渐变效果完整实例

    JS实现颜色梯度与渐变效果完整实例

    这篇文章主要介绍了JS实现颜色梯度与渐变效果,结合完整实例形式分析了js颜色渐变所涉及的数学运算与页面样式动态操作相关技巧,需要的朋友可以参考下
    2016-12-12
  • JS中多层次排序算法的实现代码

    JS中多层次排序算法的实现代码

    这篇文章主要给大家介绍了关于JS中多层次排序算法的实现代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-01-01
  • JS将数字转换成三位逗号分隔的样式(示例代码)

    JS将数字转换成三位逗号分隔的样式(示例代码)

    本篇文章主要是对JS将数字转换成三位逗号分隔的样式(示例代码)进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-02-02

最新评论