前端面试题汇总（一）（持续更新ing）

一：HTML&&CSS

1.Doctype:此标签可告知浏览器文档使用哪种HTML或XHTML规范（告诉浏览器按何种规范解析页面）

2.div+css的布局较table布局有何优势：

（1）改版的时候更方便，只需要改css文件

（2）页面加载速度更快，结构化清晰，页面显示简洁

（3）表现与结构相分离

（4）易于优化（seo）搜索引擎更友好，排名更容易靠前

3.为什么利用多个域名来存储网站资源会更有效：

（1）CDN缓存更方便

（2）突破浏览器并发限制

（3）节约cookie带宽

（4）节约主域名的连接数，优化页面响应速度

（5）防止不必要的安全问题

4.cookies,sessionStorage,localStorage的区别：

cookies,sessionStorage,localStorage的区别

5.网页制作会用到的图片格式：

png-8,png-24,jpeg,gif,svg,Webp(新鲜事物)

6.有哪些方式可以对一个DOM设置它的CSS样式

（1）内联样式，将css样式直接定义在html元素内部

（2）内联样式表，将css样式放在head标签内部

（3）外联样式表，引入一个外部css文件

7.选择器优先级基本原则：

一般而言，选择器越特殊，它的优先级越高；也就是选择器的指向越精确，它的优先级就越高。

内联>id>类>标签

8.display:none和visibility:hidden的区别：

display:隐藏对应的元素但不挤占该元素原来的空间

visibility:隐藏对应的元素并且挤占该元素原来的空间

9.BFC:

浏览器中创建了一个独立的渲染区域，该区域内所有元素的布局不会影响到区域外元素的布局，这个渲染区域只对块级元素起作用。

10.HTTP协议中，get和post有什么区别，分别适用于什么场景？

get传送的数据长度有限制，post没有

get通过URL传递，在浏览器地址栏可见，post是在报文中传递

适用场景：

post一般用于表单提交

get一般用于简单的数据查询

11.css中的content属性：

content属性专门应用在before/after伪元素上，用来插入生成内容。

最常见的应用是利用伪类消除浮动

二：JS

1.split():切割成数组的形式

join():将数组转换成字符串

2.数组方法：

push:尾部添加  pop:尾部删除

unshift:头部添加  shift:头部删除

reverse:颠倒数组中元素的位置，并返回该数组的引用

3.call和apply的作用与区别：

call和apply的作用与区别

4.事件绑定与普通事件有什么区别

传统事件绑定和符合W3C标准的事件绑定有什么区别：

div.onclick=function(){}

（1）如果说给同一个元素绑定了两次或多次相同类型的事件，那么后面绑定的会覆盖前面绑定的

（2）不支持DOM事件流 事件捕获阶段=>目标元素阶段=>事件冒泡阶段

addEventListener

（1）如果说给同一个元素绑定了两次或多次相同类型的事件，所有的绑定将会依次触发

（2）支持DOM事件流

（3）进行事件绑定传参不需要前缀on

事件绑定：把事件注册到具体的元素上

普通事件：可以用来注册的事件

5.闭包：能够读取其他函数内部变量的函数

闭包的缺点：滥用闭包会造成内存泄露，因为闭包中引用到的包裹函数中定义的变量都永远不会被释放，所以应该在必要的时候释放这个闭包函数

6.本地对象，内置对象和宿主对象

本地对象：array,obj等可以new实例化

内置对象：math等不可以被实例化

宿主：浏览器自带的window,document等

7.document.write和innerHTML的区别

document.write:只能重绘整个页面

innerHTML：可以重绘页面得一部分

8.哪些操作会造成内存泄露

内存泄漏：指任何对象在你不在需要或拥有之后依然存在

（1）setTimeout的第一个参数使用字符串而非函数时，会引发内存泄漏

（2）闭包

（3）控制台日志

（4）循环（在两个对象彼此引用且彼此保留时就会产生一个循环）

9.BOM有哪些对象：

（1）window:JS的最顶层对象，其他的BOM对象都是window的属性

（2）document：文档对象

（3）location：浏览器当前URL信息

（4）history：浏览器访问历史信息

（5）screen：客户端屏幕信息

（6）navigator：浏览器本身信息 

10.数组常用方法：

方法	描述
concat()	连接两个或更多的数组，并返回结果
join()	把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔
pop()	删除并返回数组的最后一个元素
push()	向数组的末尾添加一个或更多元素，并返回新的长度
reverse()	颠倒数组中元素的顺序
shift()	删除并返回数组的第一个元素
slice()	从某个已有的数组返回选定的元素
sort()	对数组的元素进行排序
toSource()	返回该对象的源代码
toString()	把数组转换为字符串，并返回结果
toLocaleString()	把数组转换为本地数组，并返回结果
unshift()	向数组的开头添加一个或更多元素，并返回新的长度
valueOf()	返回数组对象的原始值
splice()	删除元素，并向数组添加新元素

11.this:

在JS中，this通常指向的是我们正在执行的函数本身或者指向该函数所指的对象

全局的this：window

对象的this：指向其本身

事件的this：指向事件对象