html 表单 & 表单控件.txt

html 表单 & 表单控件.txt
参考：https://www.runoob.com/html/html-forms.html

1、表单
    定义：一个包含表单元素的区域。
    作用：接收用户数据并提交给服务器。
2、表单要素
    1、form 元素 - 收集用户信息
    2、表单控件
        能够与用户进行数据交互的可视化组件。
3、form 元素
  1、作用
     收集用户的信息并提交给服务器。
     在网页中是不可见的，但是功能不能忽略。
  2、语法
     1、标记
        <form>
           input 元素
        </form>
     2、属性
        1、action
           指定提交数据的服务地址，默认提交给本页。
           <form name="input" action="html_form_action.php" method="get">
               Username: <input type="text" name="user">
               <input type="submit" value="Submit">
           </form>
        2、method
           提交方法/方式
           默认值为 get
           取值：
              1、get
                 表示向服务器要数据时使用。
                 特点：
                    1、会将提交的数据显示在地址栏上。
                    2、安全性较低。
                    3、有提交数据的大小限制 - 2KB。
              2、post
                 要提交数据给服务器处理时使用。
                 特点：
                    1、隐式提交，看不到提交的数据。
                    2、安全性较高。
                    3、无提交数据的大小限制。
        3、enctype
           指定表单数据进行编码的方式，即允许将什么样的数据提交给服务器。
           1、application/x-www-form-urlencoded
              默认值，允许将所有的文本数据提交给服务器
           2、multipart/form-data
              允许将文件提交给服务器
           3、text/plain
              只允许将普通文本字符提交给服务器，特殊字符则不可以。
4、表单控件
  1、作用 & 注意
     作用：和用户进行数据交互的可视化组件。
     注意：只有放在表单中的表单控件，才允许被提交。
  2、表单控件
     1、文本框 与 密码框
        文本框：<input type="text">
        密码框：<input type="password">
        属性：
           1、name ：定义控件的名称
           2、value ：值
           3、maxlength ：限制输入的最大字符数
           4、readonly ：只读
              该属性允许不设置值。
           5、placeholder ：提示占位符
     2、按钮
        1、提交按钮: <input type="submit">
           将表单内容提交给服务。
        2、重置按钮:<input type="reset">
           将表单恢复到初始化的状态。
        3、普通按钮:<input type="button">
           允许通过 js 自定义功能。
        属性：
           1、value
              控制按钮上的文字
     3、单选按钮 和 复选框
        单选按钮：<input type="radio">
        复选框：<input type="checkbox">
        属性：
           1、name
              除了定义名称之外，还有分组的作用
              一组的单选按钮或复选框，name 属性值必须一致。
           2、value
              值，提前定义，当用户选择上的时候，则将该值提交给服务器。
           3、checked
              设置预选中，该属性无值。
     4、隐藏域 和 文件选择框
        1、隐藏域
           作用：想提交给服务器但不想给用户看的数据要放在隐藏域中。
           语法：
              <input type="hidden">
           属性：
              name ：控件的名称
              value：控件的值
        2、文件选择框
           <input type="file">
           属性：
              name ：控件名称
           注意：
              1、表单的 method 属性值必须为 post。
              2、表单的 enctype 属性值必须为 multipart/form-data。
     5、多行文本域
        标记：
           <textarea></textarea>
        属性：
           1、name ：定义文本域的名字。
           2、cols ：指定文本域的列数(一行中能显示多少个英文字符，中文减半)。
           3、rows ：指定文本域的行数。
     6、下拉列表
        <select name="">
           <option value="0">选项1</option>
           <option value="1">选项2</option>
        </select>