HTML基础复习（告一段落）

一辆封闭货车

已于 2022-10-27 13:05:31 修改

阅读量309

点赞数

分类专栏： html学习文章标签： html

于 2022-10-26 21:14:15 首次发布

本文链接：https://blog.csdn.net/qq_42727908/article/details/127247397

版权

html学习专栏收录该内容

2 篇文章 0 订阅

订阅专栏

参考链接： HTML元素|菜鸟教程
另一篇： HTML中一些元素或属性的区别（更新中）

HTML5 弃用的属性基本都没写

1 HTML基础
2 HTML元素
3 HTML属性
4 HTML标题
- 4.1 HTML标题
- 4.2 HTML水平线
- 4.3 HTML注释
5 HTML段落
6 HTML链接
- 6.1 target属性
- 6.2 id属性
7 HTML头部
- 7.1 head元素
- 7.2 title元素
- 7.3 base元素
- 7.4 link元素
- 7.5 style元素
- 7.6 meta元素
- 7.7 script元素
8 HTML样式
9 HTML图像
- 9.1 img元素
- 9.2 map元素
- 9.3 area元素
10 HTML表格
- 10.1 table元素
- 10.1 th元素
- 10.2 tr元素
- 10.3 td元素
- 10.4 caption元素
- 10.5 colgroup元素
- 10.6 col元素
- 10.7 thead、tbody、tfoot元素
11 HTML列表
- 11.1 ul元素
- 11.2 ol元素
11.3 li元素
11.4 dl元素(definition lists)
12 HTML区块
- 12.1 HTML块级元素和内联元素
- 12.2 div元素
- 12.3 span元素
13 HTML布局
14 HTML表单和输入
- 14.1 form标签
- 14.2 input标签
- 14.3 textarea标签
- 14.4 label标签
- 14.5 fieldset标签
- 14.6 legend标签
- 14.7 select标签
- 14.8 option标签
- 14.9 optgroup标签
- 14.10 button标签
- 14.11 datalist标签
- 14.12 output标签
15 HTML框架
- 15.1 iframe标签
16 HTML颜色
17 HTML脚本
- 17.1 script标签
- 17.2 noscript标签
- 其他
- - - 1 HTML字符实体
    - 2 HTML URL

1 HTML基础

在vscode中使用 shift+! 可以快速建立HTML框架。

在浏览器的页面上使用键盘上的 F12 按键开启调试模式，就可以看到组成标签。

HTML 是标记语言不是编程语言。
HTML 文档由HTML元素定义。
HTML 文档由 相互嵌套 的HTML元素构成。
开始标签常被称为起始标签（opening tag），结束标签常称为闭合标签（closing tag）。

2 HTML元素

开始标签	元素内容	结束标签
<p>	这是一个段落	</p>

大多数HTML 元素可拥有属性。

<html>

<body>
<p>这是第一个段落。</p>
</body>

</html>

<html> 元素定义了整个 HTML 文档。这个元素拥有一个开始标签 <html> ，以及一个结束标签 </html>。元素内容是另一个 HTML 元素（body 元素）。

HTML 中关闭标签是可选的。
但在 XHTML、XML 以及未来版本的HTML中，所有元素都 必须被关闭。
没有内容的 HTML 元素称为 空元素，空元素是在 开始标签 中进行关闭的。
关闭空元素的正确方法：在开始标签中添加斜杠，比如 <br/>。
万维网联盟（W3C）在 HTML4 中推荐使用小写，而在未来 (X)HTML 版本中强制使用小写

3 HTML属性

属性是 HTML 元素提供的附加信息。
属性一般描述于开始标签。
属性总是以键值对的形式出现，name=“value”
<a href=“http://www.runoob.com”>这是一个链接</a>
<a></a> 是一对标签，herf 是属性，http://www.runoob.com 是属性值，这是一个链接是元素内容
属性值始终包括在引号内，常用的是双引号。
必须使用单引号的情况：属性值中本身就含有双引号 name=‘John “ShotGun” Nelson’

4 HTML标题

4.1 HTML标题

双标签。
标题通过 <h1>-<h6> 双标签定义，从大到小。
浏览器会自动在标题前后添加空行。
仅用于标题，不能以生成粗体或大号的文本为目的而使用标题标签。

4.2 HTML水平线

单标签、空元素 <hr>
正确关闭：<hr/>
定义颜色要用 background-color，设置粗细是 height，去掉边框是 border:none;
三者缺一不可。

<p>这是一个段落。</p>
<hr/>

4.3 HTML注释

<!–注释内容–>
前后两个短横杠。
浏览器会忽略、不显示注释，我使用了转义符。

<!-- 这是一个注释 -->

5 HTML段落

双标签 <p></p> 定义。
是块级元素-在浏览器显示中占据一行，排斥与其他元素同一行的元素。

三大列表和表格，六大标题和表单，段落地址要分块。

浏览器会自动在段落的前后添加空行。
在不产生新段落的情况下进行换行：<br/>
对于 HTML，无法通过在 HTML 代码中添加额外的空格或换行来改变输出的效果。
显示页面时，浏览器会移除源代码中多余的空格和空行。
所有连续的空格或空行都会被算作一个空格。

<p>这是一个段落 </p>
<p>这是另一个段落</p>
<br/>新的一行

6 HTML链接

双标签 <a></a> 定义。
鼠标指针移动到某个链接上时，指针会变为一只小手。
在标签 <a> 中使用属性 herf (Hypertext Reference) 描述链接的地址。
使用外部连接时, http:// 不能省略。
默认情况下：

链接状态	表现
未访问	蓝色+下划线
点击时	红色+下划线
已访问	紫色+下划线

<a href="url">链接显示文本，图片或其他 HTML 元素</a>

6.1 target属性

定义被链接文档在何处显示。

值	描述
_blank	在新窗口中打开被链接文档
_self	默认。在相同的框架中打开被链接文档
_parent	在父框架集中打开被链接文档
_top	在整个窗口中打开被链接文档

用vs尝试之后，_blank是新窗口，其他3个都是在原本的窗口下打开链接。

6.2 id属性

创建一个 HTML 文档书签。
书签在 HTML 页面中不显示。

用vs尝试后，锚点链接，快速跳转。

7 HTML头部

7.1 head元素

所有头部元素的容器。
必须包含 title。

7.2 title元素

双标签。
是必需的。
定义了浏览器工具栏的标题。
添加到收藏夹，显示在收藏夹中的标题。
显示在搜索引擎结果页面的标题。
```
<title>标题</title>
```

7.3 base元素

单标签。
一个文档最多使用一个。
必须位于 head 元素内部。
描述基本的链接地址/目标。
作为 HTML 文档中所有相对链接的父链接（可以这样说吧？）。
切记 base 标签中的链接最后的 /

属性	值	描述
href	URL	规定页面中所有相对链接的基准URL
target	_blank	在新窗口中打开被链接文档
-	_self	默认。在相同的框架中打开被链接文档
-	_parent	在父框架集中打开被链接文档
-	_top	在整个窗口中打开被链接文档

7.4 link元素

单标签。
定义文档和外部资源之间的关系。
用于链接到样式表。

7.5 style元素

双标签。
定义 HTML 文档的样式信息。

属性	值	描述
media	media_query	为样式表规定不同的媒体类型
scoped	scoped	样式仅应用到 style 元素的父元素及子元素
type	text/css	规定样式表的 MIME 类型

MIME:(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型。
设定某种扩展名的文件用指定的应用程序来打开的方式类型，当该扩展名文件被访问时，浏览器会自动使用指定应用程序来打开。
```
<head>
	<style type="text/css">
   	 body {
        	background-color: green;
    	}

    	p {
        	color: blue;
    	}
	</style>
</head>
```

7.6 meta元素

单标签。
描述一些基本的元数据。
元数据不显示在页面上，但会被浏览器解析。
通常用于描述网页，关键词，文件最后的修改时间，作者等。

属性	值	描述
charset	character_set	定义文档的字符编码
http-equiv	content-type default-style refresh	把 content 属性关联到 HTTP 头部
name	application-name author description generator keywords	把 content 属性关联到一个名称
content	text	定义与 http-equiv 或 name 属性相关的元信息

```
<meta name="keywords" content="HTML" />
<meta name="description" content="HTML复习" />
<!--网页每30s刷新一次-->
<meta http-equiv="refresh" content="30" />
```

7.7 script元素

双标签。
用于加载脚本文件。

属性	值	描述
src	URL	规定外部脚本的 URL
type	MIME-type	规定脚本的 MIME 类型
async	async	规定异步执行脚本（仅适用于外部脚本）
charset	charset	规定在脚本中使用的字符编码（仅适用于外部脚本）
defer	defer	规定当页面已完成解析后，执行脚本（仅适用于外部脚本）

8 HTML样式

背景颜色 background-color
字体 font-family
颜色 color
字体大小 font-size
文本对齐方式：text-align

内部样式表：在 head 标签中通过 style 标签定义。

<head>
	<style type="text/css">
	body {background-color:yellow;}
	p {color:blue;}
	</style>
</head>

外部样式表：更改一个文件来改变整个站点的外观。

<head>
<!--mystyle.css是自定义的样式文件-->
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

9 HTML图像

9.1 img元素

单标签，空元素。

属性	值	描述
src	URL	图像的URL地址
alt	text	当图片无法正常显示时，可替换的文本
loading	eager、lazy	立即加载图像还是延迟加载图像
crossorigin	anonymous、use-credentials	设置图像的跨域属性
height	pixels	规定图像的高度
width	pixels	规定图像的宽度
ismap	ismap	将图像规定为服务器端图像映射
usemap	#mapname	将图像定义为客户端图像映射

9.2 map元素

双标签。
定义图像地图，有可点击区域的一幅图像。

属性	值	描述
name	text	自定义map的名称

9.3 area元素

单标签，空元素。
定义图像地图中的可点击区域。
始终嵌套在 map 元素中。

属性	值	描述
alt	text	规定区域的替代文本
coords	coordinatea	规定区域的坐标
href	URL	规定区域的目标 URL
hreflang	languege_code	规定 URL 的语言
media	media query	规定目标 URL 是为何种媒介/设备优化的，默认：all
nohref	value	HTML5 不支持。规定没有相关链接的区域
rel	属性值太多了，自查	规定当前文档与目标 URL 之间的关系
shape	default、rect、circle、poly	规定区域的形状
target	_blank、_parent、_self、_top、framename	规定在何处打开目标 URL

<body>
    <img src="照片.jpg" width="850" height="800" alt="照片" usemap="#zhaopian" />
    <map name="zhaopian">
        <area shape="rect" coords="326,84,407,448" alt="fly" target="_blank" href="fly.html" />
        <area shape="rect" coords="408,54,695,455" alt="zkf" target="_blank" href="zkf.html" />
    </map>
</body>

10 HTML表格

10.1 table元素

双标签。
定义表格。
一个HTML表格包括<table>元素，一个或多个<th> <tr> <td>元素。

属性	值	描述
border	“1”或“”	表格边框
cellpadding	number	表格边框和表格内容之间的距离
cellspacing	number	表格之间的距离

Alt

10.1 th元素

双标签。
定义 HTML 表格的表头。
称为表头单元格。
文本通常为粗体并且居中。

属性	值	描述
colspan	number	规定横跨列数
rowspan	number	规定横跨行数
headers	header_id	规定和表头单元格相关联的一个或多个表头单元格
scope	col colgroup row rowgroup	规定表头单元格是否是行，列，行组或列组的头部

10.2 tr元素

双标签。
定义 HTML 表格中的行。
一个 tr 元素中包括一个或多个 th 或 td 元素。

10.3 td元素

双标签。
定义 HTML表格中的标准单元格。
文本通常为普通的左对齐文本。

属性	值	描述
colspan	number	规定横跨列数
rowspan	number	规定横跨行数
headers	header_id	规定和单元格相关联的一个或多个表头单元格

10.4 caption元素

双标签。
定义表格的标题。
必须嵌套在 table 标签内。
每个表格只能定义一个标题。

10.5 colgroup元素

组合表格中的列，以便格式化。
嵌套在 table 和 caption 标签之后，thead、tbody、tfoot、tr 元素之前。

属性	值	描述
span	number	规定列组应该横跨的列数

10.6 col元素

规定 colgroup 元素内部每一列的列属性。

属性	值	描述
span	number	规定 col 横跨列数

10.7 thead、tbody、tfoot元素

双标签。
用于组合 HTML表格的表头内容。
和 tbody 和 tfoot 结合使用。
当包含多个页面的长的表格被打印时，表格的表头和页脚可被打印在包含表格数据的每张页面上。
thead 元素呢诶不必须包含一个或多个 tr 元素。

#### 跨行跨列 ####
<body>
    <p>
    <table border="1">
        <caption>单元格横跨两列</caption>
        <tr>
            <th>name</th>
            <th colspan="2">telephone</th>
        </tr>
        <tr>
            <td>fly</td>
            <td>1234567</td>
            <td>1234567</td>
        </tr>
    </table>
    </p>
    <p>
    <table border="1">
        <caption>单元格横跨两行</caption>
        <tr>
            <th>name</th>
            <td>zkf</td>
        </tr>
        <tr>
            <th rowspan="2">telephone</th>
            <td>1234567</td>
        </tr>
        <tr>
            <td>1234567</td>
        </tr>
    </table>
    </p>
</body>

<body>
    <table border="1" cellpadding="20" cellspacing="0">
        <caption>四宫格</caption>
        <tr>
            <td>
                <p>这是一个段落</p>
                <p>这是另一个段落</p>
            </td>
            <td>
                <p>这个单元格包含一个表格</p>
                <p>
                <table border="1">
                    <tr>
                        <td>A</td>
                        <td>B</td>
                    </tr>
                    <tr>
                        <td>C</td>
                        <td>D</td>
                    </tr>
                </table>
                </p>
            </td>
        </tr>
        <tr>
            <td>
                <p>这个单元格包含一个列表</p>
                <p>
                <ul>
                    <li>apples</li>
                    <li>bananas</li>
                    <li>pineapples</li>
                </ul>
                </p>
            </td>
            <td>
                HELLO
            </td>
        </tr>
    </table>
</body>
</html>

11 HTML列表

11.1 ul元素

双标签。
定义无序列表。
和 li 标签一起使用。

<body>
    <h1>无序列表嵌套</h1>
    <ul list-style-type:circle>
        <li>Coffee</li>
        <li>
            Tea
            <ul list-style-type:disc>
                <li>Black tea</li>
                <li>Green tea
                    <ul list-style-type:square>
                        <li>China</li>
                        <li>Africa</li>
                    </ul>
                </li>
            </ul>
        </li>
        <li>Milk</li>
    </ul>
</body>

11.2 ol元素

双标签。
定义一个有序列表。
列表排序以数字来显示。

属性	值	描述
reversed	reversed	指定列表倒序
start	number	指定列表编号的起始值，只能是整数

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>有序列表</title>
    <style>
        ol.a {
            list-style-type: decimal;
        }

        ol.b {
            list-style-type: none;
        }
    </style>
</head>

<body>
    <ol start="6" style="list-style-type: upper-roman;">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ol>
    <ol reversed>
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ol>
    <ol class="a">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ol>
    <ol class="b">
        <li>Coffee</li>
        <li>Tea</li>
        <li>Milk</li>
    </ol>
</body>

</html>

11.3 li元素

双标签。
定义列表项目。
可用在有序列表、无序列表和菜单列表中。

11.4 dl元素(definition lists)

定义一个描述列表。
和 dt (definition term自定义列表) 和 dd (definition description自定义列表描述) 一起使用。

<body>
    <dl>
        <dt>Coffee</dt>
        <dd>-Black hot drink</dd>
        <dt>Milk</dt>
        <dd>-White cold drink</dd>
    </dl>
</body>

12 HTML区块

12.1 HTML块级元素和内联元素

在浏览器显示时，块级元素 会以新行来开始、结束。
内联元素 不会以新行开始。

12.2 div元素

双标签。
块级元素。
定义 HTML 文档的区域。
用于组合块级元素。
文档布局，取代了使用表格 table 定义布局的老方法。

12.3 span元素

双标签。
是内联元素。
用于组合文档中的行内元素。
没有默认的格式表现，不应用样式时，和其他文本没有视觉上的差异。

<body>
   <div style="color:darkcyan">
       <p>
           邹科峰是大笨蛋
       </p>
   </div>
   <div style="color:darkorange">
       <p>邹科峰有一头<span style="color: black;">乌黑的</span>头发</p>
   </div>
</body>

13 HTML布局

不建议使用table标签作为布局工具。
表格不是布局工具。

**********使用div标签布局**********
 <body>
    <div id="container" style="width:500px;">
        <div id="header" style="background-color:darkorange;">
            <h1 style="margin-bottom:0;">主要的网页标题</h1>
        </div>
        <div id="menu" style="background-color:yellow; height: 200px; width: 100px;float: left; ">
            <b>菜单<br>HTML <br> CSS <br> JavaScript</b>
        </div>
        <div id="content" style="background-color:grey;height: 200px;width: 400px;float: left;">
            内容在这里
        </div>
        <div id="footer" style="background-color: darkorange; clear:both; text-align:center">
            版权 @runoob.com
        </div>
    </div>
</body>

**********使用table标签布局**********
<body>
    <table width="500px" border="0">
        <tr>
            <td colspan="2" style="background-color: darkorange;">
                <h1>主要的网页标题</h1>
            </td>
        </tr>
        <tr>
            <td style="background-color: yellow; width:100px">
                <b>菜单</b><br />HTML <br />CSS <br /> JavaScript<br />
            </td>
            <td style="background-color: grey; width:400px; height:200px;">
                内容
            </td>
        </tr>
        <tr>
            <td colspan="2" style="background-color:darkorange; text-align:center">版权 @ runoob.com</td>
        </tr>
    </table>
</body>

14 HTML表单和输入

表示文档中的一个区域。
包含交互控件。
表单用于收集用户的输入信息。
收集的信息发送到web服务器。

14.1 form标签

双标签。
用于创建供用户输入的 HTML 表单。

属性	值	描述
accpet-charset	character_set	规定服务器可处理的表单数据字符集
action	URL	规定表单的提交去向
autocomplete	on/off	规定是否启用表单的自动完成功能
enctype	application/x-www-form-urlencoded multipart/form-data text/plain	规定向服务器发送表单数据的编码方式（适用于method="post"的情况）
method	get/post	规定发送表单数据的HTTP方法
name	text	规定表单的名称
novalidate	novalidate	提交表单时不进行验证
target	_blank _self _parent \top	规定在何处打开action URL

14.2 input标签

单标签。
规定用户可以在其中输入字段。
输入字段的类型可以通过 type 属性更改。
空元素，只包含标签属性。
属性太多，用到的时候自查。

几种常用的输入类型：
文本框：<input type=“text”>
密码字段：<input type=“password”>
单选按钮：<input type=“radio”>
复选框：<input type=“checkbox”>
提交按钮：<input type=“submit”>

14.3 textarea标签

双标签。
定义一个多行的文本输入控件。

14.4 label标签

双标签
为 input 元素定义标注。
label 的 for 属性应当和相关元素的 id 属性相同。

在这里插入图片描述

属性	值	描述
for	element_id	规定label和哪个表单元素绑定
form	form_id	规定label字段所述的一个或多个表单

<body>
    <p>点击其中一个文本标签选中选项</p>
    <form action="demo_form.php">
        <label for="male">Male</label>
        <input type="radio" name="sex" id="male" value="male"><br />
        <label for="female">Female</label>
        <input type="radio" name="sex" id="female" value="female"><br />
        <input type="submit" value="提交">
    </form>
</body>

14.5 fieldset标签

双标签
将表单内的相关元素分组。
会在相关表单元素周围绘制边框。

属性	值	描述
disabled	disabled	规定该组中的相关表单元素应该被禁用
form	form_id	规定fieldset所属的表单
name	text	规定fieldset的名称

<body>
    <form>
        <fieldset>
       <!-- legend用于定义fieldset的名称 -->
            <legend>Personalia</legend>
            姓：<input type="text"><br />
            名：<input type="text"><br />
            生日：<input type="text">
        </fieldset>
    </form>
</body>

14.6 legend标签

双标签。
用于定义 fieldset 的名称。

14.7 select标签

双标签。
创建下拉列表。
是一种表单控件。
和 option 标签（双标签）合用。

属性	值	描述
autofocus	autofocus	规定在页面加载时下拉列表自动获得焦点
disabled	disabled	当该属性为true时，禁用下拉列表
form	form_id	定义select字段所属的表单
multiple	multiple	当该属性为true时，可多选
name	text	定义下拉列表的名称
required	required	规定必须选择一个选项
size	number	规定下拉列表可见选项的数目

14.8 option标签

定义下拉列表中的一个选项。
option 标签中的内容作为 select 或 datalist 的一个元素使用。

属性	值	描述
disabled	disabled	规定此选项在首次加载时被禁用
label	text	定义描述
selected	selected	规定选项表现为选中状态
value	text	定义送往服务器的选项值

14.9 optgroup标签

双标签。
将相关的选项组合在一起。

属性	值	描述
disabled	disabled	规定禁用该选项组
label	text	为选项组规定描述

<body>
    <select name="pet">
        <optgroup label="肉食动物">
            <option value="pig">Pig</option>
            <option value="cat" selected>Cat</option>
            <option value="dog">Dog</option>
        </optgroup>
        <optgroup label="素食动物">
            <option value="rabbit">Rabbit</option>
            <option value="sheep">Sheep</option>
        </optgroup>
    </select>
</body>

14.10 button标签

双标签。
定义一个按钮。
可以在 button 元素内部放置文本或图像内容。
始终要规定 type 属性。
属性自查。

14.11 datalist标签

双标签。
规定 input 元素可能的选项列表。
下拉列表中选项是预先定义好的。
使用 input 标签中的 list 属性来绑定 datalist。

14.12 output标签

作为计算结果输出显示。

属性	值	描述
for	element_id	描述计算中使用的元素与计算结果之间的关系
form	form_id	定义输入字段所属的表单
name	name	定义表单提交时对象的名称

15 HTML框架

15.1 iframe标签

双标签。
规定一个内联框架。
在同一个浏览器窗口中显示不止一个页面。

属性	值	描述
height	pixels	规定<iframe>的高度
width	pixels	规定<iframe>的宽度
name	name	规定<iframe>的名称
sandbox	“”	启用所有限制条件
sandbox	allow-same-origin	允许将内容作为普通来源对待。如果未使用该关键字，嵌入的内容将被视为一个独立的源。
sandbox	allow-top-navigation	嵌入的页面的上下文可以导航（加载）内容到顶级的浏览上下文环境（browsing context）。
sandbox	allow-forms	允许表单提交。
sandbox	allow-scripts	允许脚本执行。
seamless	seamless	规定<iframe>看起来像是父文档中的一部分
src	URL	规定显示文档的URL
scrdoc	HTML_code	规定显示页面中的HTML内容

第一步

<body>
    <h1>这个页面显示在iframe中</h1>
</body>

第二步

<body>
    <iframe src="demo.html" frameborder="0"></iframe>
</body>

第三步

<body>
    <iframe src="demo_iframe.html" frameborder="0" height="700" width="1000" name="iframe_a">
        <!--noopener是防止 如果链接到受恶意代码影响的外部网站 则该网站可以更改您的网站以窃取信息并传播恶意代码-->
        <!--target是指定新窗口打开的位置-->
    </iframe>
    <p><a href="https://www.runoob.com" target="iframe_a" rel="noopener">菜鸟</a></p>
</body>

本来网址用的百度，但是百度拒绝连接😂

16 HTML颜色

HTML 颜色由RGB混合而成。
由一个十六进制符合定义。
从 #000000 到 #FFFFFF。
一共有1600万种不同颜色。
HTML和CSS中规范定义的颜色名称有141个（17个标准颜色+124）。

<body>
    <p style="background-color:rgb(255,255,0,0)">
        通过 rbg 值设置背景颜色
    </p>
    <p style="background-color:rgba(255,255,0,0.25)">
        通过 rbg 值设置背景颜色
    </p>
    <p style="background-color:rgba(255,255,0,0.5)">
        通过 rbg 值设置背景颜色
    </p>
    <p style="background-color:rgba(255,255,0,0.75)">
        通过 rbg 值设置背景颜色
    </p>
    <p style="background-color:rgba(255,255,0)">
        通过 rbg 值设置背景颜色
    </p>
</body>

17 HTML脚本

JavaScript 使 HTML 页面具有更强的动态和交互性。

17.1 script标签

用于定义客户端脚本，比如 JavaScript。
既可包含脚本语句，也可通过 src 属性指向外部脚本文件。
用于图像操作、表单验证以及动态内容更改。
使用 src 属性时，script 元素必须是空的。

属性	值	描述
async	async	规定异步执行外部脚本
charset	charset	规定在外部脚本中使用的字符编码
defer	defer	规定当页面已完成解析后，执行外部脚本
src	URL	规定外部脚本的URL
type	MIME-type	规定脚本的 MIME 类型

17.2 noscript标签

用于定义在脚本未被执行时的替代内容。

其他

1 HTML字符实体

用时自查。
实体区分大小写。

2 HTML URL

语法规则：scheme://host.domain:port/path/filename

名称	说明
scheme	定义因特网服务的类型，最常见的是http(超文本传输协议)
host	定义域主机(http默认主机是www)
domain	定义因特网域名
:port	定义主机上的端口号(http端口默认80)
path	定义服务器上的路径
filename	定义文档/资源的名称