表单标签

标签

• 格式
• 作用
• 注意事项
• 可以用来做什么有趣的事情

解答

● <form>表单的标签</form>

- form标签是一个组合标签，他内在的组成的标签才是学习的大头

input标签

• 格式
• 作用
• 注意事项
• 可以用来做什么有趣的事情

解答

● <input type="属性值">

- 总是忍不住去想这个标签是怎么实现的，因为和之前所有标签都不同，之前所有的标签都只是一个展示的功能，引入这个标签之后，我们输入的内容竟然可以出现在浏览器上
- type=”text”:明文输入框
- 扩展：账号：<input type="text">是合法的吗？
- type=”password”：密文输入框
- value=”test”：指定默认的输入值
- 扩展：为什么input不是闭合的？
- type=”raido”：单选按钮
- 怎么理解：收音机，收音机的按钮只能按下一个，按下其他的就会跳起
- 容易被忽略的细节，我告诉了你以上两个知识点，你是否就认为自己可以设计出一个2选1的单选框了？试试看能否做得到
- 其实再html中可能已经涉及到了css样式（居中，对齐，颜色，背景颜色），js（事件，鼠标点击，键盘输入）
- 表单的出现或许可以媲美a标签，扩展了超文本的含义，用户不再是单方面的接受者
- 在HTML中，如果属性的取值和属性的名字一样，可以只写一个，比如checked，但是xhtml中要补全，企业开发中建议不要省略写
- type=”checked box”
- 事实上，忽略语义的，单选和多选是可以互换的，单选不使用NAME，多选使用不同的name多选没有办法达到单选的效果

解答扩展

• 是合法的
• 从某种角度将，默认输入值不是必须的，是可选的，如果默认输入值是必须的，那么input标签可能就是闭合的了
• 实际上是做不到的，这个就需要实践才知道了，缺少了一项东西：在有多个单选框的时候，浏览器要怎么样才能知道哪些单选框是关联在一起的
• 实施上可以衍生到其余所有的标签——浏览器要怎么样在有多个标签的情况下进行判断

综合

• 思路：现实世界的表单是什么？
• 一张纸，在医院，银行，邮局等都有
• 思路2：为什么我们要填表单，表单有什么用？
• 是填表人和发表人之间交互的一种形式，可以用填表人-发表人填写的形式来替代
• 思路3：网上有哪些表单
• 像我们注册QQ，邮箱，填写的都是表单，像是百度搜索框这种表单反而是少数，在现实世界中反而找不到对应的
• 思路4：表单和表格有什么区别
• 在HTML中的表格反而更像是现实世界中的公告板，是服务器端方面展示给用户看的,而form标签更像是现实世界中需要填写的表格

关于表单标签和表格标签的一些补充：

• 我们我容易忽略单一标签（自己起的名字），如p标签，h标签这些本身就具有语义的，与table标签，form标签这些需要和其他标签一起使用才合理的组合标签（也是自己起的名字）的区别
• 可以试一下<table>这是一个不完整的标签</table>，看下在浏览器中显示是什么效果，查看审查元素又是什么样的
• 可以显示，但是在审查元素中文字是不包裹在table标签内的
• 同理<tr>test</tr>、<th>test</th>、<td></td>、<caption>test</caption>
• 脱离了table标签，这些标签甚至不能被识别，他们的内容（test）都直接放在了body元素中间
• 同理<li>test</li>
• 可以正常显示，说明浏览器有补全父标签（自己起的名字）的功能
• 这类组合标签是否显得比较复杂？
• 事实上，只需要记住内容是包裹在td内的就行了，table和tr都不能包裹内容
• 如果写成<tr><h2>test</h2></tr>
• 浏览器会自动把h2标签提出table标签
• 所以说tr,table标签都是不能够包裹内容的