html的简单知识点

2020/11/24

先挖坑,明天开始html的学习

关于常见添加元素

标签,图片,超链接,视频等等

iframe内联框架

用于在网页中任意的位置嵌入另一个网页

  width和height默认单位名称为px,也可以使用%
  scrolling="no" 禁止使用滚动条
  frameborder=“0” 数字0代表无边框 1代表有边框
  allowtransprency=true 透明显示
默认情况下iframe的背景是透明的,要想兼容一些版本较旧的浏览器,需要按照下面的方式写代码
另外还需要将border的背景颜色设置为

Background-color:transparency;

表单

表单是控件的容器,一个表单由form元素、表单控件和表单按钮三部分组成:

1) form元素:用来创建表单,并通过 action、method和enctype三个属性,来设置表单的提交路径、提交方式、编码类型。

2) 表单控件:主要用来收集用户数据,包括 label、input、textarea、select、datalist、keygen、progress、meter、output等,也包括对表单控件进行分组显示的 fieldset 和 legend 控件。根据功能的不同,input 控件又分为 text、password、radio、checkbod、file、submit、reset、search、tel、url、email、number、range、color、Date Pickers等类型。

3) 表单按钮:包括提交按钮、重置按钮和一般按钮。提交按钮和一般按钮可用于把表单数据发送到服务器,重置按钮用于重置表单,把整个表单恢复到初始状态。

任何HTML表单,都由 form 元素创建,即以

标签开始, 标签结束,在 和 之间,是表单所需要的控件和按钮。

每一个表单控件都有一个 name 属性,用于在提交表单时,对表单数据进行识别。访问者通过提交按钮提交表单,表单提交后,他们填写的数据就会发送到服务器端进行处理。如,用户登录的表单:


  1. action="login.asp" method="post">
  2. 用户名: type="text" name="username" />
  3. 密码: type="password" name="password" />
  4. type="submit" value=" 登 录 " />

上述代码中,由 form 元素创建了一个表单,表单中包括两个控件和两个按钮,分别是用户名和密码的输入型控件,及登录和取消按钮。登录按钮为提交按钮,取消按钮为重置按钮。运行结果如图 3‑1 所示:

用户登录表单图3-1 用户登录表单

当用户点击登录按钮后,则以 post 方式,将用户名和密码发送到服务器端login.asp 文件进行处理;如果用户点击取消按钮,则会清除用户填写的数据,将整个表单恢复到页面初始加载时的状态。

表单元素的格式:

image-20201201170013925

2、说明:(摘自:https://blog.csdn.net/aiming66/article/details/79045300)

在表单中,我们可以输入的元素大致可以分成两种:输入赋值和选择赋值。虽然有两种,但是其最终结果却是一样的。都是先为一个变量赋值,然后后将此变量传到服务器进行处理。

type="text" name="test_name" value="165"

  上面的实例中,test_name就是一个变量名,test_name的初始值就是value=“165”,当我们删除输入框中的初始值,然后写入新值的时候比如777,test_name的值变成了777,提交表单的时候,就会将变量test_name和其新赋值提交到服务器等。

type="radio" name="test_radio" value="not">



type="radio" name=" test_radio" value="yes">

  虽然是两行代码,但是这两个单选框为一组,只能选择一个。两个选项都是为 test_radio赋值,所赋值即每个选项 value 的值。表单提交时同样会提交变量 test_radio及它的 value.

与ajax的相似之处:

这里写图片描述

问题:有一个问题一定要明确,当我们不使用ajax提交数据的时候,提交表单时type=“submit”属性是一定需要的,

因为这样编译器就已经封装了向服务器发送数据的方法,不再用我们自己编写提交数据的方法。当点击提交按钮之后,

编译器自动将所有带有type="submit"属性的标签的 (name,value)提取出来,组成Json串发送到服务器。

get和post方式提交

get:高效,但是不安全

post:安全,可以传输大文件

3、表单提交后,后台如何处理:

1、提交到JSP,jsp处理

表单初级验证

posted @ 2020-12-01 17:17  晚新  阅读(42)  评论(0)    收藏  举报