美文网首页
html面试总结

html面试总结

作者: 许小小晴 | 来源:发表于2018-02-01 09:27 被阅读19次

    摘自https://www.jianshu.com/p/431c91c8140c

    1.doctype的作用是什么?

    声明文档的解析类型(document.compatMode),目的是要告诉标准通用标记语言解析器,它应该使用什么样的文档类型定义(DTD)来解析文档避免浏览器的怪异模式。没有DOCTYPE的声明,那么compatMode默认就是BackCompat(怪异模式),

    2标准模式,接近标准模式,怪异模式的区别?

    在标准模式页面按照HTML,CSS的定义渲染,而在怪异模式就是浏览器为了兼容很早之前针对旧版本浏览器设计,并未严格遵循W3C标准而产生的一种页面渲染模式。

    (1 )盒模型:

    (2)图片元素的垂直对齐方式:

    对于inline元素和table-cell元素,标准模式下vertical-align属性默认取值为baseline,在怪异模式下,table单元格中的图片的vertical-align属性默认取值为bottom,因此在图片底部会有及像素的空间。

    (3)元素中的字体:

    CSS中,对于font的属性都是可以继承的,怪异模式下,对于table元素,字体的某些元素将不会从body等其他封装元素中继承得到,特别是font-size属性。

    (4)内联元素的尺寸:

    标准模式下,non-replaced inline元素无法自定义大小,怪异模式下,定义这些元素的width,height属性可以影响这些元素显示的尺寸。

    (5)元素的百分比高度:

    a:CSS中对于元素的百分比高度规定如下:百分比为元素包含块的高度,不可为负值,如果包含块的高度没有显示给出,该值等同于auto,所以百分比的高度必须在父元素有高度声明的情况下使用。

    b:当一个元素使用百分比高度时,标准模式下,高度取决于内容变化,怪异模式下,百分比高度被正确应用。

    (6)元素溢出的处理:

    标准模式下,overflow取默认值visible,在怪异模式下,该溢出会被当做扩展box来对待,即元素的大小由其内容决定,溢出不会裁减,元素框自动调整,包含溢出内容。

    3.HTML和XHTML的区别?

    XHTML 是更严格更纯净的 HTML 代码,指可扩展超文本标签语言,是一个 W3C 标准

    HTML 是用来描述网页的一种语言,指的是超文本标记语言 ,是一套标记标签

    XHTML 元素必须被正确地嵌套。

    XHTML 元素必须被关闭

    标签名必须用小写字母。

    XHTML 文档必须拥有根元素

    4.服务器返回application/xhtml+xml格式的页面有什么问题?

    是XHTML系列文档的类型,要求比较严格,必须有head、body标签且每个元素必须是关闭的。

    一些老的浏览器不支持

    5.cookie,sessionStorage以及localStorage有什么不同?

    答: sessionStorage、localStorage、cookie都是在浏览器端存储的数据 有了本地数据,

    就可以避免数据在浏览器和服务器间不必要地来回传递。

    sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可用于web请求之间保存数据。

    ① session保存在服务器,客户端不知道其中的信息,数据可以保存在集群、数据库、文件中;cookie保存在客户端,服务器能够知道其中的信息;

    ② session中保存的是对象,cookie中保存的是字符串;

    ③ session不能区分路径,同一个用户在访问一个网站期间,所有的session在任何一个地方都可以访问到。而cookie中如果设置了路径参数,那么同一个网站中不同路径下的cookie互相是访问不到的;

    ④ session 的运行依赖 session id,而 session id 是存在 cookie 中的,也就是说,如果浏览器禁用了 cookie ,同时 session 也会失效;

    ⑤ 单个cookie在客户端的限制是3K;

    ① cookie在浏览器和服务器间来回传递,而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存;

    ② cookie不是很安全。

    ③ cookie储存的数据小;4k-5M

    ④ 数据有效期不同,localStorage始终有效;

    ⑤ 作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的;

    ⑥ sessionStorage和localStorage接口更多。

    6.,以及的不同?

    浏览器会立即加载并执行相应的脚本。也就是说在渲染script标签之后的文档之前,不等待后续加载的文档元素,读到就开始加载和执行,此举会阻塞后续文档的加载;

    有了async(并行异步)属性,表示后续文档的加载和渲染与js脚本的加载和执行是并行进行的,即异步执行;------加载完就执行

    有了defer属性,加载后续文档的过程和js脚本的加载(此时仅加载不执行)是并行进行的(异步),js脚本的执行需要等到文档所有元素解析完成之后,DOMContentLoaded事件触发执行之前;虽然异步但是按顺序,按加载顺序执行脚本

    7.使用data-*属性的好处是什么?

    用于存储页面或应用程序的私有自定义数据,存储的(自定义)数据能够被页面的 JavaScript 中利用,

    属性名不应该包含任何大写字母,并且在前缀data- 之后必须有至少一个字符

    属性值可以是任意字符串

    data-属性是 HTML5 中的新属性.

    dataset属性存取data-

    自定义属性的值data 去掉,后变大写。只有在Chrome 8+ Firefox(Gecko) 6.0+ Internet Explorer 11+ Opera 11.10+ Safari 6+浏览器中实现

    使用attribute方法可以存取 data-*自定义属性的值

    8.为什么说把CSS 标签放在标签里,把正好放在的前面是个好的主意?你知道哪些例外情况吗?

    css和JavaScript不一定写在head里比较好,我习惯于单独设立css和js文件,把代码写在里面,这样方便查找和管理

    而css和js的引用位置是放在头部还是尾部取决于一个加载顺序

    当加载头部以后会同步加载头部中引用的文件,而css样式表在这里加载会规定网页的总体样式

    js如果需要先加载后运行则写在头里,需要其他内容加载完之后在运行则可以写在尾部。(其他内容加载完再运行)

    9.使用过哪些HTML模板语言?

    Vue中文本{{}},使用 v-html 指令用于输出 html 代码,绑定v-bind 指令,{{JavaScript 表达式}},指令是带有 v- 前缀的特殊属性,v-model,|过滤器,

    html模板是别人做出来的网页模板 html是一种编程语音

    10.什么是渐进式渲染?说一说你所了解的技术?

    对渲染进行分割 从具体的使用的场景, 不同的 Level 实际上对应不同的页面内容,论坛是一个比较清晰的例子, 想象一个论坛:

    网页的静态部分, HTML 固定的内容, 比如导航栏和底部

    页面首屏的内容, 比如一个论坛的话题

    页面首屏看不到的内容, 比如话题下面多少回复

    切换路由才会显示的页面, 比如导航的另一个页面

    对于这样的情况, 显然有若干种可行的渲染分割的方案

    全在客户端渲染

    相关文章

      网友评论

          本文标题:html面试总结

          本文链接:https://www.haomeiwen.com/subject/ilgrzxtx.html