javaWeb后端_HTML

控制浏览器请求行为

HTML: Hyper Text Markup Language （超文本标记语言）
超文本: 流媒体、图片、声音、视频
由大量的标签组成，每一个标签都有开始标签和结束标签

1. 控制浏览器请求地址

URL:统一资源定位符
URL的组成：

protocol:// hostname[:port] / path / [;parameters][?query]#fragment

协议://[用户名:口令@]域名[:端口]/路径/文件名.文件后缀?参数=值#标志

(带方括号[]的为可选项)
eg:

 http://www.baidu.com  
 https://editor.csdn.net/md/?articleId=113811458

(1) 超链接标签命令

<a href="https://www.hao123.com/" target="_self">
			<img src="img/hao123.png" width="120px"/>
		</a>
<!--
			href：hot references 热引用
			href属性后面一定是一个资源的地址。
			是绝对路径也可以是相对路径，可以是网络中某个资源的路径，也可以是本地资源的路径。
		-->
		<!--
			超链接有一个target属性：
				_blank : 新窗口
				_self ： 当前窗口（默认就是这种方式。）
				_top ： 顶级窗口
				_parent ： 父窗口
		-->
		<a href="http://www.baidu.com">百度</a>
<!--
	超链接的作用：
		通过超链接可以从浏览器向服务器发送请求。
		浏览器向服务器发送数据（请求：request）
		服务器向浏览器发送数据（响应：response）
		
		B/S结构的系统：每一个请求都会对应一个响应。
	用户点击超链接和用户在浏览器地址栏上直接输入URL:本质上没有区别，都是向服务器发送请求。
		-->

(2) 表单标签命令

<!--这个按钮与普通的超链接区别不大（超链接和表单都可以向服务器发送请求，只不过表单发送请求的同时可以携带数据）-->
<form action="http://www.baidu.com">
	<input type="submit" value="百度" />
</form>

2. 控制浏览器请求方式

GET方式与POST方式

POST方式	GET方式
可携带任意大小的请求参数 (用于文件上传场景)	携带的请求参数不能超过4kb (无法进行文件上传)
在浏览器地址栏上隐藏请求参数(用于注册登录场景)	必须在浏览器地址栏上将请求参数显示出来
必须将请求参数信息保存在HTTP请求协议的请求体中	必须将请求参数信息保存在HTTP请求协议的请求头中
禁止浏览器将所接收的返回资源文件内容保存(用于需要索要服务器中实时数据的场景)	要求浏览器在接收所返回的资源文件内容后，必须将资源文件内容保存在浏览器缓存中

浏览器控制台：按F12键，调出浏览器控制台的Network选项，(看第一个请求即原始请求)可以看到请求方式

超链接标签命令	表单域标签命令
只能以GET方式发起请求	通过method属性设置GET/POST请求方式, 默认为GET

控制浏览器采用POST方式发起请求：
只能利用<form method = "post"> </form>

3. 控制浏览器请求参数

浏览器的所有请求参数都是String类型，在服务端获取请求参数时用String类型来接收

(1) 超链接标签命令

<a href="http://www.baidu.com?username=mike&password = 123">百度</a>

(2) 表单域标签命令

a) 表单域标签：

• 定义

     一组定义在<form></form>标签内部的标签命令
  

• 分类

1) <input /> (文本框、密码框、单选框、多选框、文件选择框、重置按钮、提交按钮)
2) <select></select> (下拉列表标签)
3) <textarea></textarea>(多行文本框，一般作为备注信息)

b) 表单域标签的属性：

• 表单域标签都有name和value两个属性

• value属性的默认值：

大多数表单域标签value属性的默认值是空字符串“”，(注：空字符串是字符串，不是null，null是空)
单选框 radio 和多选框checkbox 的value属性默认值是 “on” 字符串

c) 表单域标签作为请求参数的条件：

• 必须声明在<form></form>标签内部
• 必须声明 name 属性
• 对于单选框 radio 和多选框checkbox 标签还必须满足被选中的条件
  (注：被 disabled 修饰的标签无法作为请求参数）

readonly	disabled
不支持用户修改	不支持用户修改
被修饰的参数仍可作为请求参数	被修饰的参数无法作为请求参数

(可适用于某些属性值固定，不支持用户修改的场景)

eg:

<form action="http://www.baidu.com">
	<input type="submit" value="百度" /><!--提交按钮-->
	<input type="button" value="设置按钮上显示的文本"/>	<!--普通按钮，无提交功能-->
</form>

<!--表单提交给服务器的格式：-->
action?name=value&name=value&name=value&name=value&name=value

4.页面请求的工作流程

转载博客