基础HTML（2）

1.web开发的整体架构

web场景（一个网页） ：=多个资源的配合下共同完成

                                      每个资源都需要一个独立的HTTP请求/响应完成

这些资源可以来自同一个web服务器，也可以来自不同的web服务器

主机（host）决定了 资源位于网络中的那台电脑（主机）上 通常是ip地址或者域名

端口（post）决定了 资源由主机上的那个 进程（process）提供服务 这个进程就是我们所谓的web服务器 我们目前使用的Tomcat  

资源路径（path）决定了请求的是web服务器中的那个资源，可以分成绝对路径 和 相对路径

我们所谓的 web开发，就是准备各种互相配合的web资源的过程。

资源分类  

生成方式角度

静态资源：  资源内容是提前准备好的

动态资源：  资源内容是遇到请求时才执行程序生成出来的--发生在运行时

资源内容格式角度（无穷多个，我们列举常见的几个）：

1.纯文本 2.HTML   3.CSS  4. js  5.json 6.多媒体（图片.视频.音频等）

 关于文件系统的树模型 以及 资源的路径

不仅仅是web应用，实际上整个电脑（甚至手机等）的文件系统，都是采用 树的模型进行管理的 无序树 + 允许多个孩子的树

 web应用通常需要制指定一个 静态资源的根目录（也被称为文档根doc，root，或者被称为 web根 web root）

相对路径：相对某个位置然后到达某个结点的路径

HTML/CSS/JS 中书写路径

1资源和当前资源，处于同一个web服务器管理下或者没又处于同一个web服务器管下

.

 2.省略协议

资源和当前资源，处于同一个web服务器管理下：

 备注：当请求的不是同一个web服务器管理的资源时，可能遇到别人的防盗链，使得我们无法使用别的资源。

 HTML Hyper Text MarKup Language

1.由标签（tag）组成的一棵树形结构，由于这个标签处于一棵树上，所以有时候也用元素（element）或者结点（node）

2.基本结构

关于html本身的信息 ：

1.标签 <title>标题</title>

2.字符集编码<meta charset= "utf-8">

3.常见标签

块级标签（block），自带换行h1--h6，p

内联标签 （inline），不换行， <img scr = "...." >  <a href = ".....”>....</a>

4.<img>  <a>  属于可以让几个资源产生关系（联系）的标签

表格相关的标签（使用频率3颗星）

 无论是thead，tbody，tfoot都是先有 表行（tr table row）组成，每一行里，又有多列组成，其中thead中的 列 使用（th）表示，tbody中的 列 由（td）表示。

 

 如果运行无法访问

 如果没有写结构thead，tbody，tfoot

列表（用，但使用频率3颗星）

1.有序列表 （ordered list   <ol>）

2.无序列表 （unordered list <ul>）

列表项（列表中的一个元素）（list item <li>）

有序列表与无序列表的区别：

 关于 <dl> ：<dl>元素（或HTML描述列表元素）是一个包含术语定义以及描述的列表，通常用于展示·词汇表或者（键 - 值对列表）。

 

 小结，上述讲述的所有标签，都是单方面的信息传递：从服务器到客户端（浏览器）的传递

但是在实际web场景中，经常需要从浏览器向服务器去传递一些信息（这些信息大部分来自用户的输入）比如：

登录，注册场景下：用户名 + 密码     用户输入 -> 浏览器收集-> 传递给服务器做下一步动作

使用 CSDN B站 抖音这种UGC场景 ： 内容（博客（文字），视频音频）

UGC：User Generate Content  用户来生成内容

用户输入-> 浏览器收集->传递给服务器做下一步动作

 表单的标签：

 

 

 

 

 小结：

1·）文件系统  和 资源路径 

2）HTML标签

表格相关的：<table> <thead> <tbody> <tfoot> <tr> <th> <td>

3)表单

1.理解表单的整体流程·

1）先发起一次请求，得到 要去填写的 表单

2） 填写信息 + 点击提交 （有其他提交方式）：再次发起一次请求，携带用户填写的信息到服务器，其中新的请求的URL，由<form>标签的action属性决定，备注：如果没有action属性，则URL不变（还是表单的URL）通常都要指定action的，2新的请求的资源路径，并不要求必须存在一个资源所以可能出现404（路径对应的资源不存在）

2.需要表单的场景

需要从用户向服务器交信息时，比如：注册环境，登录环境，发表文章，UGC等

<inout name = "...."> 输入控件，name属性对应的业务上的名字（尽量有语义，尽量用英文）

最后会以 key=value 的形式提交给=服务器，其中key就是input的name属性的值，value就是这个input中用户输入的内容！

整个用户输入，一般称为请求参数（request parameters） 经常使用动态资源的形式，读取这部分的信息