• Javascript高级编程学习笔记(73)—— 表单(1)表单基础


    表单

    JS最初的一个用途就是帮助服务器分担处理表单的责任

    时至今日,虽然web应用以及JS都有了长足的发展,但是表单依然是现在web应用中比较重要的部分。

    因为默认的表单控件很丑,所以有时候我们会使用自定义的组件来完成表单的功能,这就需要我们对表单有一个较为详细的了解。

    表单基础

    在HTML中,表单是由 <form> 元素表示的,在JS中表单则对应了 HTMLFormElement 类型

    该类型继承自 HTMLElement ,因此表单拥有与其它HTML元素相同的默认属性

    不过表单也有自己独有的属性和方法,如下所示:

    • acceptCharset:服务器能够处理的字符集,等效于 accept-charset 特性
    • action:接收请求的URL,等价于HTML中的 action 特性
    • elements:表单中所有控件的集合(HTMLCollection)
    • enctype:请求的编码类型,等效于 enctype 特性
    • length:表单中的控件数量
    • method:发送的HTTP请求类型,等效于 method 特性
    • name:表单的名称,等效于 name 特性
    • reset():将表单中的所有控件重置为 reset
    • submit():提交表单
    • target:用于发送请求和接收响应窗口的名称,等价于HTML的target特性

    表单的获取方式和其它的HTML元素的方式一样

    但是通过 document.forms 可以获取页面中所有表单的集合,该集合可以通过表单的name和数值索引来获取特定的表单

    如:

    var form1 = document.forms[0];//获取页面中的第一个表单
    var form2 = document.forms["form2"];//获取name为form2的表单

    另外,在早期的浏览器中会将每个设置了name特性的表单作为属性保存在 document 对象上,以上面 name 为 form2的表单为例

    var form2 = document.form2

    但是这种用法只在向后兼容的浏览器中生效,所以应尽量避免使用

  • 相关阅读:
    Python时钟,计算程序运行时间
    关于等高线绘制和全平面坐标节点生成
    Springboot配置文件映射
    Docker和Rancher
    ElasticSearch story(二)
    Elastic Story(一)
    由数量众多照片拼贴而成的马赛克图片
    lnmp一键安装包配置laravel项目
    mysql 创建用户与授权、修改密码
    centos 安装 ntpdate 并同步时间
  • 原文地址:https://www.cnblogs.com/lhyxq/p/10442510.html
Copyright © 2020-2023  润新知