课程咨询:400-111-8989

  • 值得一看的HTML5面试题及答案

    发布:HTML5培训  来源:html5职场  时间: 2018年05月04日

  • 毕业季马上快到了,即将毕业找工作的小伙伴也开始做准备了。今天小编为准备参加HTML5面试的小伙伴们准备了这篇HTML5面试题及相关题目的答案,小伙伴们快来看一看,希望对你有所帮助哦。...

  • 毕业季马上快到了,即将毕业找工作的小伙伴也开始做准备了。今天小编为准备参加HTML5面试的小伙伴们准备了这篇HTML5面试题及相关题目的答案,小伙伴们快来看一看,希望对你有所帮助哦。

    值得一看的HTML5面试题及答案

    1、文字超出显示为省略号

    [css] view plain copy print?

    //单行:

    overflow: hidden;

    text-overflow:ellipsis;

    white-space: nowrap;

    //多行:

    display: -webkit-box;

    -webkit-box-orient: vertical;

    -webkit-line-clamp: 3;

    overflow: hidden;

    2、div垂直居中

    [html] view plain copy print?

    position: absolute;

    top: 50%;

    left: 50%;

    background-color: #000;

    -webkit-transform: translateX(-50%) translateY(-50%);

    3、浏览器加载过程

    浏览器接收到html代码,可能是一份完整的文档,也可能是一个chunk,即开始解析。解析过程是先构建dom树,再根据dom树构建渲染树,渲染树根据渲染树就会绘制到浏览器上。构建dom树的过程即根据html代码自上而下构建dom树,当遇到script文件加载/执行会阻塞后面dom树的构建(javascript可能会改变dom树),而遇到css文件则会阻塞渲染树的构建,即dom树依然继续构建(除非遇到script标签并且css文件依旧未加载完成),但不会渲染绘制到页面上。而无论哪个阻塞,该加载的文件还是会加载,例如html文档中的其他css/js/图片文件。至于javascript被加载后就会被执行,执行的过程也阻塞树的构建。是执行完了才解析其他内容,而不是执行完了才加载其他内容。

    4、http请求过程

    a. 域名解析

    b. 发起TCP的3次握手

    c. 建立TCP连接后发起http请求

    d. 服务器端响应http请求,浏览器得到html代码

    e. 浏览器解析html代码,并请求html代码中的资源

    f. 浏览器对页面进行渲染呈现给用户

    5、sessionStorage和localStorage的区别,以及cookes和web storage的区别

    sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。而localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。

    6、web storage和cookie的区别

    Web Storage的概念和cookie相似,区别是它是为了更大容量存储设计的。Cookie的大小是受限的,并且每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽,另外cookie还需要指定作用域,不可以跨域调用。除此之外,Web Storage拥有setItem,getItem,removeItem,clear等方法,不像cookie需要前端开发者自己封装setCookie,getCookie。但是Cookie也是不可以或缺的:Cookie的作用是与服务器进行交互,作为HTTP规范的一部分而存在 ,而Web Storage仅仅是为了在本地“存储”数据而生。

    7、Ajax请求的原理?

    (1)创建XMLHttpRequest对象,也就是创建一个异步调用对象.

    (2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息.

    (3)设置响应HTTP请求状态变化的函数.

    (4)发送HTTP请求.

    (5)获取异步调用返回的数据

    (6)使用JavaScript和DOM实现局部刷新

    8、原型、原型链

    每个函数都有一个prototype(原型)属性;对象是没有原型的,但是有_proto_(原型链),指向父级函数的原型。

    9、事件委托、事件冒泡、事件捕获

    一个div里面有个span元素 ,当鼠标单击span时,这个事件算是谁的?div还是span?

    事件冒泡: IE认为,这个事件首先触发span,然后依次往父节点传递,最终传递到document,(这个过程称为冒泡)

    事件捕获:网景浏览器认为,任何事件都首先触发document,然后依次往下传递到span元素,(这个过程称为捕获)

    事件委托:根据事件冒泡机制,任何事件都会冒泡到document,事件委托就是把所有事件处理函数绑定到document,根据事件参数判断事件源对象,判断不同的对象给予不同的处理函数,

    10、跨域

    a: josnp (最常用一种方式 ,耗时最短,最有效)是通过get请求

    简单来说就是利用jsonp动态添加一个script标签,而script标签的src属性是没有跨域的限制的。这样说来,这种跨域方式其实与ajax XmlHttpRequest协议了

    b :服务器设置响应头

    http://localhost:8080 发起ajax请求

    接口所在服务器http://localhost:8090

    “Access-Control-Allow Origin”,“http://localhost:8090”

    c : 服务器重定向(代理)

    http://localhost:8080 发起ajax请求

    本地服务器接口 http://localhost:8080做一个代理接口,后端调后端 绕过安全协议

    以上就是小编为大家准备的HTML5面试题及答案了,希望本篇文章能够对正在找工作和准备找工作的小伙伴们有所帮助。希望你们能面试成功,顺利找到工作,如果觉得自己HTML5技术不是很成熟的小伙伴,可以选择一家靠谱的HTML5培训机构进行学习哦。祝你成功!

    【免责声明:本文图片及文字信息均由小编转载自网络,旨在分享提供阅读,版权归原作者所有,如有侵权请联系我们进行删除。】

  • 上一篇:未来HTML5开发的四大应用趋势!

    下一篇:这些HTML5培训基础知识你应该知道

网站导航
2002-2018 达内时代科技集团有限公司 版权所有 京ICP证8000853号-56