刷题笔记之html错题笔记二

总结：在这套题中，刷到了许多htnl5之前废弃的元素，我一开始以为废弃了的就不会考，但是面试题中这类的比例还不少，需要复习一下。

涉及主要知识点：json xml html废弃元素 继承 js同步异步机制 空元素 重绘重排

1、

1.ins标签用来定义插入元素的
2.keygen 用于表单的密钥对生成器字段 新的WEB标准已经废弃
3.key xml里面的key
4.用于定义用户可能调用的命令 就支持ie9

2、继承顺序

继承顺序
HTMLDivElement > HTMLElement > Element > Node > EvenTarget

3js同步异步机制

这里考的是JS的运行机制！ 事件(click,focus等等)，定时器(setTimeout和setInterval)，ajax,都是会触发异步，属于异步任务；js是单线程的，一个时间点只能做一件事，优先处理同步任务； 按照代码从上往下执行，遇到异步，就挂起，放到异步任务里，继续执行同步任务，只有同步任务执行完了，才去看看有没有异步任务，然后再按照顺序执行！ 这里for循环是同步任务，onclick是异步任务，所以等for循环执行完了，i变成4了，注意：这里因为i是全局变量，最后一个i++，使得i为4(后面的onclick函数，最后在循环外面执行，不受i<length限制)； 所以for循环每执行一次，onclick事件函数都会被挂起一次，共4次； for循环结束后，点击事件 触发了4个onclick函数，接着输出4个4！

4 html5废弃元素

5html5中废除的元素

1、能用css代替的元素
basefont、big、center、font、s、strike、tt、u。这些元素纯粹是为画面展示服务的，HTML5中提倡把画面展示性功能放在css中统一编辑。

2、不再使用frame框架。

frameset、frame、noframes。HTML5中不支持frame框架，只支持iframe框架，或者用服务器方创建的由多个页面组成的符合页面的形式，删除以上这三个标签。

3、只有部分浏览器支持的元素

applet、bgsound、blink、marquee等标签。

6空元素

在 HTML 中有以下这些空元素：

when the span is present

---

body标签的两个属性background和bgcolor，其中background只能写url表示背景图像,bgcolor写背景颜色
Html5不支持，Html4.01已废弃

7json

A.“#div .red”就是选择CSS class属性中包括red的所有Id为div元素
B.{“name”: “John”， “age”: 18},json数据中的键都需要添加""(双引号）。做的时候没注意这个细节
D.不同浏览器提供的编程环境不一致（包括html、css、js编程的不一致），所以在编程时才要使用 -ms、-webkit、-moz来实现不同浏览器的兼容性（解决css编程不一致）
E.JS文件按在HTML中引入的顺序依次载入（不是最后载入），在载入后马上执行，执行时会阻塞页面后续的内容（包括页面的渲染、其它资源的下载）
F.箭头函数没有super关键字，所以箭头函数没有继承任何对象，也就不可能继承Function类。

8重绘重排

体现：

repaint是某个DOM元素进行重绘；reflow是整个页面进行重排，也就是页面所有DOM元素渲染。

如何触发：

style变动造成repaint和reflow。

不涉及任何DOM元素的排版问题的变动为repaint，例如元素的color/text-align/text-decoration等等属性的变动。

除上面所提到的DOM元素style的修改基本为reflow。例如元素的任何涉及长、宽、行高、边框、display等style的修改。

常见触发场景：

触发repaint：
color的修改，如color=#ddd；
text-align的修改，如text-align=center；
a:hover也会造成重绘。
:hover引起的颜色等不导致页面回流的style变动。
等等太多，一时间写出来也太难想了。
触发reflow：
width/height/border/margin/padding的修改，如width=778px；
动画，:hover等伪类引起的元素表现改动，display=none等造成页面回流；
appendChild等DOM元素操作；
font类style的修改；
background的修改，注意着字面上可能以为是重绘，但是浏览器确实回流了，经过浏览器厂家的优化，部分background的修改只触发repaint，当然IE不用考虑；
scroll页面，这个不可避免；
resize页面，桌面版本的进行浏览器大小的缩放，移动端的话，还没玩过能拖动程序，resize程序窗口大小的多窗口操作系统。
读取元素的属性（这个无法理解，但是技术达人是这么说的，那就把它当做定理吧）：读取元素的某些属性（offsetLeft、offsetTop、offsetHeight、offsetWidth、scrollTop/Left/Width/Height、clientTop/Left/Width/Height、getComputedStyle()、currentStyle(in IE))；

9xml

10 xml json

B ----- HTML-Hyper Text Markup Language超文本标记语言，被设计用来显示数据，核心在于数据的外观。HTML文档网页 XML-EXtensible Markup Language可扩展标记语言，被设计用于结构化、传输和存储数据，核心在于数据的内容。XML文档纯文本 你可以选择在web应用程序中，使用XML传输数据，使用HTML格式化并显示数据。它们不是相似竞争互相替代的关系，它们互相合作和互补。 所以从设计理念上看，HTML和XML的关系，就像Java和Javascript、雷锋和雷峰塔的关系-即相互独立，基本没啥关系。 https://www.jianshu.com/p/5f5ebefd0cbe ------------------------------------------------------------------- E -----JSON可以包含更多的结构化信息，更容易表达不同的数据格式，像numbers ，string 和NULL值，甚至是数组。