form.elements[i]
原生js操作form的一些方法，来看下面写的这个demo,这个demo是展示了一下form.eleemnts[i]的意义和用法：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>form.elements</title>
</head>
<body>
<div class="wrap">
<form>
<p>
<label for="username">
用户名：
</label>
<input type="text" placeholder="请输入用户名">
</p>
<p>
<label for="psw">
密码：
</label>
<input type="text" placeholder="请输入密码">
</p>
<p><input type="submit" value="登录"></p>
</form>
<form>
<p>
<label for="username">
用户名：
</label>
<input type="text" placeholder="请输入用户名" value="xiaoming">
</p>
<p>
<label for="psw">
密码：
</label>
<input type="text" placeholder="请输入密码" value="123455">
</p>
<p>
<label for="pswok">
密码：
</label>
<input type="text" placeholder="请输入密码" value="123455">
</p>
<p><input type="submit" value="注册"></p>
</form>
</div>
<script>
window.onload = function(){
var form1 = window.document.forms[0];
var form2 = window.document.forms[1];
document.write("form1的长度："+form1.length+"------"+"form2的长度："+form2.length+"<br />"); //需求：打印form2中所有input的value与input
for(var i=0; i<form2.length; i++){
document.write(form2.elements[i].value);
document.write("<br />");
document.write(form2.elements[i].type);
document.write("<br />");
} // 需求：循环遍历，如果input的type==text,则清空input的value值
for(var i=0; i<form2.length; i++){
if(form2.elements[i].type == 'text'){
form2.elements[i].value =''
}
}
}
</script>
</body>
</html>
感兴趣的，多练习一下，就明白我们获取form的方法和form.elements[i]的意义了，希望这个demo对你有所帮助。
form.elements[i]的更多相关文章
- form.elements属性
form.elements属性与childNodes属性不同的是form.elements只返回的是表单元素组成的数组,包括input,textarea等
- js81:Image对象，几张图像缓存完之后动画显示，form.elements[],document.images[]
原文发布时间为:2008-11-09 -- 来源于本人的百度文章 [由搬家工具导入] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...
- 创建dynamics CRM client-side (十三) - 在HTML Web Resource中获取form elements & 获取外部js文件
上一节我们讨论到创建HTML Web Resource. 但是纯HTML的页面不能满足我们的需求, 所以今天我们来做在HTML Web Resource中获取form elements Please ...
- js Form.elements[i]的使用实例
function pdf(){ //一个html里面可能存在多个form,所以document.form[0]指的是第一个form,document.form[1]返回就是第二个form,如果没 ...
- Creating Form Elements --Using BeginForm and EndForm 使用内建的Form辅助器方法 精通ASP.NET MVC 5
Using the BeginForm and EndForm Helper Methods in the CreatePerson.cshtml File
- js的form基础知识点
在HTML 中,表单是由<form>元素来表示的,而在JavaScript 中,表单对应的则是HTMLForm-Element 类型.HTMLFormElement 继承了HTMLElem ...
- HtmlAgilityPack中通过sibling才能得到对应的InnerText和form，option等tag的子节点
[背景] 之前使用HtmlAgilityPack期间,遇到了2个bug: 1. InnerText没有包含对应字符串(但是用NextSibling.InnerText却可以得到) 对于html: ? ...
- ASP.NET MVC3 Dynamically added form fields model binding
Adding new Item to a list of items, inline is a very nice feature you can provide to your user. Thi ...
- javascript表单（form)序列化
function serialize(form){ var part =[]; var field = null; var i; var j; var len; var optLen; var opt ...
随机推荐
- mongodb批量更新操作文档的数组键
persons文档的数据如下: > db.persons.find(){ "_id" : 2, "name" : 2 }{ "_id" ...
- 基于 ZooKeeper 搭建 Spark 高可用集群
一.集群规划 二.前置条件 三.Spark集群搭建 3.1 下载解压 3.2 配置环境变量 3.3 集群配置 3.4 安装包分发 四.启 ...
- WebFlux 集成 Thymeleaf 、 Mongodb 实践 - Spring Boot（六）
这是泥瓦匠的第105篇原创 文章工程: JDK 1.8 Maven 3.5.2 Spring Boot 2.1.3.RELEASE 工程名:springboot-webflux-5-thymeleaf ...
- 推荐一个Redis管理工具
Redis是一个开源(BSD许可),内存存储的数据结构服务器,可用作数据库,高速缓存和消息队列代理.它支持字符串.哈希表.列表.集合.有序集合,位图,hyperloglogs等数据类型.内置复制.Lu ...
- python 如何在某.py文件中调用其他.py内的函数
A.py的文件需要调用B.py文件内的test函数 同一目录下: A.py #!/usr/bin/env python # -*- coding: utf- -*- def test(): ''' 测 ...
- 使用new新建动态二维数组(多注意)
#include<iostream> using namespace std; int main() { //设想要建立一个rows行,cols列的矩阵 //使用new进行新建 int r ...
- 设计模式-工厂方法模式（FactoryMethod）
工厂方法模式又称多态工厂模式.工厂方法模式是定义一个创建产品对象的接口(FruitFactory),将具体创建工作给具体的实现类(AppFactory,BananaFactory,PearFactor ...
- 分享常见的HTTP状态码
本内容摘抄自RUNOOB.COM 当浏览一个网页时,浏览器会向网页所在服务器发出请求.当浏览器确定接收并显示网页之前,此网页所在的服务器会返回一个含有HTTP状态码(HTTP Status Code) ...
- C#8.0: 在 LINQ 中支持异步的 IAsyncEnumerable
C# 8.0中,提供了一种新的IAsyncEnumerable<T>接口,在对集合进行迭代时,支持异步操作.比如在读取文本中的多行字符串时,如果读取每行字符串的时候使用同步方法,那么会导致 ...
- gePlugin封装成winform控件，一行代码即可加载。
将插件直接封装为控件,大大简化了GEPlugin的使用.多数常用功能也已经封装完毕,其他功能全部开放接口,直接调用即可. 1. GepluginControl控件传送门: 链接:https://pan ...