HTML知识点

嘻嘻嘿嘿哈哈

已于 2022-02-17 17:09:38 修改

阅读量972

点赞数

文章标签： html 前端

于 2022-01-28 15:26:53 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_43924896/article/details/121981576

版权

这篇文章主要介绍一些个人对于HTML的盲区跟误区。

字符实体

HTML 中的预留字符必须被替换为字符实体。
无法在键盘上键入的字符，可以用字符实体代替来显示。

字符实体类似这样：

&entity_name;
或者
&#entity_number;

e.g. < 或 <用来显示小于号

提示：

使用实体名而不是数字的好处是，名称易于记忆。不过坏处是，浏览器也许并不支持所有实体名称（对实体数字的支持却很好）。
实体名称对大小写敏感！
实体数字可以是十进制或十六进制

预留字符

在 HTML 中，某些字符是预留的。
e.g.
不能使用小于号（<）和大于号（>），因为浏览器会误认为它们是标签。
由于浏览器总是会截短 HTML 页面中的空格，所以不间断空格也要用字符实体表示。

无法在键盘上键入的字符

普通键盘上不存在众多数学、技术和货币符号以及表情符号，无法在键盘上键入，但始终可以使用实体编号来显示它们

数学、技术和货币符号

e.g. ∀ ∂ Α © ↑等等

表情符号（Emoji）

e.g.😄 😍 💗
Emoji 类似图像或图标，但它们并不是，它们是来自 UTF-8字符集的字母（字符）。
由于表情符号是字符，因此可以像 HTML 中的其他任何字符一样复制、显示和调整它们的大小。
e.g.

<p style="font-size:48px">
&#128512; &#128516; &#128525; &#128151;
</p>

HTML 中的字符实体

常用的

在这里插入图片描述

完整列表

参考HTML符号
e.g.
在这里插入图片描述

字符集

为了正确显示 HTML 页面，Web 浏览器必须知道要使用哪个字符集。
e.g. 上文提到的表情符号就是utf-8里的字符

指定

在 <meta>标签的charset属性中指定
e.g. <meta charset="UTF-8">

从 ASCII 到 UTF-8

ASCII 是第一个字符编码标准。ASCII 定义了 128 种可以在互联网上使用的字符：数字（0-9）、英文字母（A-Z）和一些特殊字符，比如：! $ + - ( ) @ < >。

ISO-8859-1 是 HTML 4 的默认字符集。此字符集支持 256 个不同的字符代码。HTML 4 同时支持 UTF-8。

ANSI（Windows-1252）是原始的 Windows 字符集。 ANSI 与 ISO-8859-1 相同，不同之处在于 ANSI 具有 32 个额外的字符。

HTML5 规范鼓励 Web 开发人员使用 UTF-8 字符集，该字符集涵盖了世界上几乎所有的字符和符号！

好像，HTML5默认是utf-8字符集

字符集之间的差异

在这里插入图片描述

这里只是为了说明，第一列其实就是实体数字

统一资源定位器 - URL

URL - Uniform Resource Locator，统一资源定位器。也被称为网址。
URL用于定位万维网上的文档；
URL遵守以下的语法规则：

scheme://host.domain:port/path/filename

scheme - 定义因特网服务的类型。最常见的类型是 http
host - 定义域主机（http 的默认主机是 www）
domain - 定义因特网域名，比如 w3school.com.cn
:port - 定义主机上的端口号（http 的默认端口号是 80）
path - 定义服务器上的路径（如果省略，则文档必须位于网站的根目录中）。
filename - 定义文档/资源的名称

流行的因特网服务的类型（scheme ）

Scheme	中文	用于…
http	超文本传输协议	以 http:// 开头的普通网页。不加密。
https	安全超文本传输协议	安全网页。加密所有信息交换。
ftp	文件传输协议	将文件下载或上传至网站。
file		计算机上的文件

URL 字符编码

URL 编码会将字符转换为可通过因特网传输的格式。

作用

如上，URL，即统一资源定位器，Web 浏览器是通过 URL 从 web 服务器请求页面的。URL 是网页的地址，比如 http://www.w3school.com.cn。
而URL 只能使用 ASCII 字符集来通过因特网进行发送。
由于 URL 常常会包含 ASCII 集合之外的字符，URL 必须转换为有效的 ASCII 格式。

机制

URL 编码使用 “%” 其后跟随两位的十六进制数来替换非 ASCII 字符。
URL 不能包含空格。URL 编码通常使用 + 来替换空格。
e.g. ‘你好’的URL编码结果是‘%E4%BD%A0%E5%A5%BD’
URL 编码参考手册

HTML 元素的属性

适用于大多数 HTML 元素的属性：

属性	值	描述
class	类名	规定元素的类名（classname）
id	id	规定元素的唯一 id
style	样式定义	规定元素的行内样式（inline style）
title	文本	规定元素的额外信息

HTML 标准属性参考手册

HTML 事件

HTML 有能力让事件触发浏览器中的动作，例如当用户单击元素时启动某一段JavaScript脚本。
以下是可添加到 HTML 元素以定义事件操作的事件属性：

Window 事件属性 - 应用到<body> 标签 e.g. onload, onresize, onafterprint
Form 事件 - 应用到几乎所有 HTML 元素，最常用在 form 元素中 e.g. onfocus, onchange, onsubmit
Keyboard 事件 - 应用到大部分HTML 元素，具体可参考API e.g. onkeydown, onkeypress
Mouse 事件 - 应用到大部分HTML 元素，具体可参考API e.g. onclick, ondblclick, onmousemove
Media 事件 - 适用于所有 HTML 元素，但常见于媒介元素中，比如 <audio>、<embed>、<img>、<video> e.g. onwaiting

HTML 事件参考手册

通过 JavaScript 代码，结合HTML事件属性，HTML 允许您向 HTML 元素添加事件处理程序。
通过使用单引号/双引号的方式：
e.g.

<button onclick="this.innerHTML=Date()">现在的时间是？</button> // 直接写代码
<button onclick="displayDate()">现在的时间是？</button> // 调用函数

这也是HTML实现用户交互的最常见的方式吧。