现在的位置: 首页 > 综合 > 正文

Web前端面试问题汇总

2018年04月02日 ⁄ 综合 ⁄ 共 1481字 ⁄ 字号 评论关闭

一.     html doctype
是什么意思

<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

二.     闭包的作用

1是前面提到的读取函数内部的变量,定制函数

2是让这些变量的值保存在内存中,实现数据共享

 

1匿名自执行函数

 

2缓存

 

3实现封装

 

4 闭包的另一个重要用途是实现面向对象中的对象,传统的对象语言都提供类的模板机制,

 

http://blog.csdn.net/sunlylorn/article/details/6534610

三.     数组去重

Array.prototype.unique2 = function()

{

       varn = {},r=[]; //n为hash表,r为临时数组

       for(vari = 0; i < this.length; i++) //遍历当前数组

       {

              if(!n[this[i]]) //如果hash表中没有当前项

              {

                     n[this[i]]= true; //存入hash表

                     r.push(this[i]);//把当前数组的当前项push到临时数组里面

              }

       }

       returnr;

}

 

四.     ajax跨域请求

代理、jsonp(动态生成、静态生成、框架)

五.     BFC清除浮动

说一下自己的拙见,clear:left属性只是消除其左侧div浮动对它自己造成的影响,而不会改变左侧div甚至于父容器的表现,在父容器看来,三个div还都是float的,所以高度依旧塌陷。但是我们在最后添加了一个非浮动的div,由于它有clear:left属性,所以它会按照左侧div不浮动来定位自己,也就是定位到下一行,而父容器看到有一个非浮动、普通流的子元素元素,会将其包围,这样造成了顺便也把三个浮动元素也包裹起来的效果,高度不再塌陷(不知道说明白没有或者这种理解对不对,还望明白的同学指点)。

float为 left|right

overflow为 hidden|auto|scroll

display为 table-cell|table-caption|inline-block

position为 absolute|fixed

我们可以对父容器添加这些属性来形成BFC达到“清浮动”效果

六.     html语义化

清晰的结构、手机浏览器自动适配、有利于SEO、便于开发维护

七.     如何让首屏快速加载

第一网络方面:

减少次数:合并图片、css、js、加入expires或cache-control header ETags、css js外部文件用来缓存、延迟加载

减少大小:压缩html css js,启用gzip压缩,精简css js

优化网络:静态资源cdn、同域名减少dns

 

第二渲染方面:

避免空src、href、重定向

css放顶部 js放尾部

避免使用css表达式

Ajax使用缓存、 Get代替Post

减少dom元素数量

减少cookies大小

不用滤镜

缩小并缓存favicon.ico

 

第三高级方面:

img有大小的标明 避免图片放缩

display: none visibility:hidden

关注repaint和reflow并持续改进

八.     如何无阻塞加载脚本

1.放网页底部

2.defer属性

3.动态添加

4.用很小的初始化代码引入,然后异步加载

5.延迟加载

6.第三方库LABs

九.     如何编写跨浏览器css

IE hack

十.     JS单例模式

抱歉!评论已关闭.