About HTML
HTML 简介
HTML 历史
最初的 HTMl 是由 CERN负责制定的，后来转交给 IETF。
在 1990-1995 年期间， HTML 经历了许多次的版本修改与扩充；
1995 年的时候 HTML 的版本更新到了 HTML3.0；1997 年又完成了 HTML3.2；
同年也完成了 HTML4；次年，W3C 决定停止发展 HTML，转向和 XML 等效的 XHTML，XHTML1.0 在 2000 年制订完成；
发布了 XHTML1.0 后，在 XHTML 模块化的旗帜下，W3C 发布了与 HTML 和 XHTML 不兼容的 XHTML2.0；
在 2003 年，XForms 的发布重新点燃了人们对于 HTML 的兴趣，人们意识到 XML 仅仅适合被用作新技术（如 RSS，Atom）的载体，而不适合用来替换现有的技术（如 HTML）；
2004 年的 W3C 的研讨会上一些 HTML5 的早期提案被提交给 W3C，但是被 W3C 以该提案与其发展理念相冲突为由给拒绝，于是 W3C 决定继续开发 XHTML；
随后 Apple，Mozilla 和 Opera 一起创建了 WHATWG，版权为三个创始公司所有，WHATWG 的几个基本原则：保持向下兼容，修改规范而不是实现，规范必须足够详细防止实现规范的公司互相去逆向；WHATWG 要求 HTML5 规范包括 HTML4，XHTML1.0 和 DOM2HTML；
2006 年 W3C 表示了对 HTML5 开发的兴趣，在 2007 年和 WHATWG 组建了一个工作组来开发 HTML5 规范，WHATWG 的三个创始人公司也允许 W3C 将 HTML5 规范挂到 W3C 的名义下；
两个团队一起工作了多年，直到 2011 年，两个团队出现了分歧，W3C 希望将 HTML5 定位为 HTML 系列的最后一个规范，而 WHATWG 希望继续改进和迭代 HTML5 规范。两个团队也一起工作到现在。
HTML 的可扩展性
HTML 提供了很广泛的扩展性支持来为 HTML 文档增添语义化的支持：
使用 class 属性来拓展元素的含义与行为，但是使用更加符合语义的元素可以帮助游览器以及其它插件更好的识别出元素所代表的含义与行为。
使用 data-*="" 来将数据绑定到元素上，HTML 也提供了相应的 API 来查询和修改这些数据。
使用 <meta name="" content=""> 来定义元数据。
使用 <script type=""> 可以嵌入原始数据，可以选择内联文档和外部文档。
通过 embed 标签创建和使用插件，这也是 Flash 工作的原理。
可以通过 JavaScript 的原型机制来拓展 API，许多脚本库就是这样设计的。
HTML 基本语法
一个经典的 HTML 代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sample page</title>
</head>
<body>
<h1>Sample page</h1>
<p>This is a <a href="demo.html">simple</a> sample.</p>
<!-- this is a comment -->
</body>
</html>HTML 文档是由一些元素和文本组成的，非闭合元素必须包括开始标签和结束标签，闭合元素可以省略结束标签。
在 HTML 中，html 元素就是 window.document。这是一个文档元素，他包括 head 和 body 两个元素；像上面代码中的 h1 里的文本会被解析成文本节点，包括像一些换行和空格等字符也会被解析成文本节点。
Note：head 开始标签之前的文本节点会被用户代理直接忽略掉，而 body 的结束标签之后的文本节点则会被插入到 body 结束标签之前。
head 标签包括一个 title 元素，title 包括一个文本节点。
元素如果包含元素只能包含完整的元素，而不能是其一部分。比如：
<p>This is <em>very <strong>wrong</em>!</strong></p>元素可以通过设置其属性来控制其样式和行为；比如：
<a href="demo.html">simple</a>
游览器解析的时候会认为这是一条超链接，并且给它加上下划线和颜色来突出这个元素。
属性的语法是键值对的形式，key 和 value 用等号分隔，value 推荐用单引号或双引号括起来；value 如果不包含空格或反单引号，单引号，双引号，等号可以不写单引号或双引号。
对于空属性可以只写属性名，省略等号。
DOM 与 CSS
DOM 提供了一些 API 给脚本语言（如：JavaScript）来修改 DOM。比如：
<form name="main">
Result: <output name="result"></output>
<script>
document.forms.main.elements.result.value = 'Hello World';
</script>
</form>
<script>
var a = document.links[0]; // obtain the first link in the document
a.href = 'sample.html'; // change the destination URL of the link
a.protocol = 'https'; // change just the scheme part of the URL
a.setAttribute('href', 'https://example.com/'); // change the content attribute directly
</script>HTML 本身是独立于与其交互的媒体的。HTML 可能会被渲染到屏幕，语音合成器，或者在盲文显示屏上。为了控制在不同的媒体上需要 HTML 被展示成什么样子，你需要样式语言（如：CSS）。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sample styled page</title>
<style>
body { background: navy; color: yellow; }
</style>
</head>
<body>
<h1>Sample styled page</h1>
<p>This page is just a demo.</p>
</body>
</html>HTML 安全
HTML 在样式语言和脚本语言的作用下变得可以交互之后，一堆安全问题也随之出现；Web 安全模型是基于源（"origins"）的概念；许多 Web 攻击都是和跨域相关。
XSS 通过向 HTML 注入脚本或其他用户代理能识别的信息来改变 HTML；如果这段注入能被保存的话，其他用户会受到降维打击；
SQL注入 常常利用表单的提交将输入信息提交到 Web 服务器后，在将信息保存到数据库时，由于代码没有过滤输入可能会导致攻击者修改数据库中的信息。
解决方法：过滤用户输入，以及用户信息的输出。
由于 HTML 表单的提交可以发生在任意的站点上，并且提交会附带上对应站点的 cookie；因此当用户访问某些恶意站点时，站点可以偷偷提交用户访问过的一些网站（如购物网站）的 HTML 表单；使得用户在无意识中受到降维打击。
解决方法：Web 服务器检查提交的站点的 Origin 字段是否来自于收信任的站点，否则应该拒绝；由于攻击方只是利用用户代理在提交表单时会提交 cookie，本身并不知道 cookie 的值，因此可以在表单里加上一段隐藏 token 来来验证是否是本站点的提交，隐藏 token 可以是 cookie 哈希后得到。
恶意占地那利用一些信息诱导用户点击，然后触发一些用户不希望看到的行为。
如：用户进入一个网站，显示一个游戏，有一个开始按钮，当用户点击后可能被诱导至购物网站；或者将受害网站放在一个 iframe 里，当用户点击时，迅速将 iframe 移动至鼠标下方。
解决办法：可以判断 top 和 window 是否相等来判断站点是否处于 iframe 中。
最后
荆轲刺秦王~
随机推荐
- pyinstaller打包exe文件，运行时一闪而过
pyinstaller打包exe文件出现命令窗口一闪而过 原因:exe运行过程中出错了,解决这些错误就可以了 解决方法: 通过 cd path >> xxx.exe 在命令行中运行exe文 ...
- Vue 源码解读（11）—— render helper
前言 上一篇文章 Vue 源码解读(10)-- 编译器 之 生成渲染函数 最后讲到组件更新时,需要先执行编译器生成的渲染函数得到组件的 vnode. 渲染函数之所以能生成 vnode 是通过其中的 _ ...
- while + else 使用，while死循环与while的嵌套，for循环基本使用，range关键字，for的循环补充(break、continue、else) ，for循环的嵌套，基本数据类型及内置方法
今日内容 内容概要 while + else 使用 while死循环与while的嵌套 for循环基本使用 range关键字 for的循环补充(break.continue.else) for循环的嵌 ...
- SQL注入 - SQLi-Labs靶场过关记录
Less-1 1.看报错类型,确定注入点 ?id=1' order by 4--++ 2.确定数据库 ?id=-1' union select 1,2,3--++ 3.查看数据库 ?id=-1' un ...
- 防止SQL 注入；如何进行防SQL 注入。
防止SQL 注入:1.开启配置文件中的magic_quotes_gpc 和magic_quotes_runtime 设置2.执行sql 语句时使用addslashes 进行sql 语句转换3.Sql ...
- Bert不完全手册2. Bert不能做NLG？MASS/UNILM/BART
Bert通过双向LM处理语言理解问题,GPT则通过单向LM解决生成问题,那如果既想拥有BERT的双向理解能力,又想做生成嘞?成年人才不要做选择!这类需求,主要包括seq2seq中生成对输入有强依赖的场 ...
- 宇宙最強的IDE - Visual Studio 25岁生日快乐
每位开发者从入门开始或多或少都会接触过 Visual Studio , 现今的 Visual Studio 除了支持传统的 C++ , C# , Visual Basic.NET ,F# 的编程语言外 ...
- vue项目部署到阿里云服务器(windows)，Nginx代理！
项目构成: 前端:vue+vant-ui, 数据库:mysql, 后端:node.js 部署方式:nginx代理: 一,首先要拥有自己的服务器,阿里,腾讯都可以,我用的是阿里的: 如果只是做个人项目的 ...
- ActiveMQ-模块代码-02
模块模式 p2p模式 生产者 ConfigBeanQueue package com.producerp2p.producerp2p; import org.apache.activemq.comma ...
- Spring AOP调用本类方法为什么没有生效
首先请思考一下以下代码执行的结果: LogAop.java //声明一个AOP拦截service包下的所有方法@Aspectpublic class LogAop { @Around("ex ...