表单是网页用于向服务器发送数据的元素。其用法类似下面：
form标签对及其内部的所有子元素共同组成了表单。提交表单时，浏览器会将form标签对内所有具有name属性的标签的键值提交给服务器。
令人惊奇的是，一个表单子元素可不在form标签内，但是却从属于一个表单。要让一个form标签外的表单子元素从属于某一表单，只需要将该表单子元素的form属性设置为该表单form元素的id。其用法类似下面：
当点击提交按钮时，浏览器会把所有从属于表单且具有name属性的标签的键值对提交给服务器，在上面这个例子里会向浏览器提交username和password键值对。需要说明的是，如果提交按钮也有name属性，那么提交按钮的值也会被提交给浏览器；如果在form标签对外有多个提交按钮，那么只有被点击的按钮的值会被提交给服务器，未被点击的按钮的值不会被提交给服务器。
“从属于表单的控件可不在form标签内”这一特性有两种妙用。
第一，将提交按钮与form标签分离，放在行内元素中。form元素是块元素，它需要单独占据一行，所以form不能位于行内元素内（虽然浏览器的容错能力很强，能容忍这种错误）。但有时确实有将提交按钮放在行内元素内的需求，例如点赞、点踩、收藏按钮等。这时可将提交按钮与form标签分离，并放在行内元素内。如下是一个示例。
第二，多个提交按钮共用一个form元素，减少代码量。可以发现，上例所示的form标签的内容都是相同的，所以点赞、点踩、收藏三个按钮可共用一个form元素。示例如下。
Original: https://www.cnblogs.com/cnblog-user/p/15419438.html
Author: Halloworlds
Title: 表单的子元素可不在form标签内
原创文章受到原创版权保护。转载请注明出处：https://www.johngo689.com/711515/
转载文章受原作者版权保护。转载请注明原作者出处！