前端笔试题整理

CSS

1、css reset是什么

每种浏览器对css的变现形式都可能不一样，为了默认未初始化的表现形式，一般使用reset.css文件进行样式初始化。

2、css sprites是什么，怎么实现？

css sprites又叫css精灵，如果页面使用太多图标，这样不利于页面加载，我们可以将所有图标放置到一张大图中按规则排列起来，然后我们按照需求从中取出对应位置的图形作为标签背景即可达到相应效果。
比如，先设置一个.sprites使其background-image：url(...)和backgr-repeat：no-repeat，即将大图设置为背景，然后需要的用到的地方设置.sprites属性，并使用background-position:(width:容器宽;height:容器高;x:x坐标;y:y坐标)来引用。

3、浏览器标准模式和怪异模式之间的区别是什么?

在html/css等标准出现之前，各大浏览器对页面的渲染效果有自己的处理方式，在html/css等标准出现之后，之后的浏览器版本一般都能支持这些标准，但是又不能让浏览器不能兼容之前版本的开发，所以浏览器保留了自己之前的那套标准，当有申明时启用标准模式进行渲染，否则使用怪异模式，依次来兼容旧版本非标准化。
使用window.top.document.compatMode可以查看当前浏览器模式。

4、你如何对网站的文件和资源进行优化?期待的解决方案包括？

1.文件合并
2.文件最小化/文件压缩
3.使用CDN托管
4.缓存的使用

5、什么是语义化的HTML?

就是让标签具有意义，比如em和i标签，两者看似效果都是倾斜，但意义不同，前者是对文本进行划重点，后者则是文本倾斜。两者只是表现形式都是斜体罢了。让HTML语义化就是让文档和内容更有意义，让整体结构清晰，也便于搜索机器人进行文档处理。

6、清除浮动的几种方式，各自的优缺点

在非IE浏览器（如Firefox）下，当容器的高度为auto，且容器的内容中有浮动（float为left或right）的元素，在这种情况下，容器的高度不能自动伸长以适应内容的高度，使得内容溢出到容器外面而影响（甚至破坏）布局的现象。这个现象叫浮动溢出，为了防止这个现象的出现而进行的CSS处理，就叫CSS清除浮动。一般有以下方法：
1.使用css属性clear:both（理论上能清楚任何标签，缺点是增加无意义的标签）
2.给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动，另外在 IE6 中还需要触发 hasLayout ，例如为父元素设置容器宽高或设置 zoom:1。
3.是用:afert伪元素清除浮动(用于非IE浏览器) ,给浮动元素的容器添加一个clearfix的class，然后给这个class添加一个:after伪元素实现元素末尾添加一个看不见的块元素（Block element）清理浮动。
7、CSS选择器有哪些？
类选择器、元素选择器、id选择器、属性选择器、派生选择器

一些实际的案例请参考：https://code.tutsplus.com/zh-hans/tutorials/the-30-css-selectors-you-must-memorize--net-16048

JavaScript

1、typeof的返回类型有哪些？

返回字符串,5种基本数据类型的返回：number,string,undefined,boolean,但null返回object，然后就是function申明的返回function类型。

2、js的数据类型有哪几种？例举3种强制类型转换和2种隐式类型转换?

js中的6种数据类型：number object string boolean null undefiine
强制转换比如：（parseInt,parseFloat）

隐式（== – ===）
为什么说是强制类型转换呢？看下图：

字符串转化为数字

3、split() join() 的区别

前者是切割成数组的形式，后者是将数组转换成字符串。（默认逗号）

4、数组方法pop() push() unshift() shift()

push()尾部添加 pop()尾部删除
unshift()头部添加 shift()头部删除

5、普通事件和绑定事件有什么不同？

普通事件中的onclick是DOM0级事件只支持单个事件，会被其他onclick事件覆盖，而事件绑定中的addEventListener是DOM2级事件可以添加多个事件而不用担心被覆盖。

6、IE和DOM事件流的区别

事件流其实就是指浏览器关于处理事件时的流向（顺序），分为冒泡流和捕获流。详细请参考：https://www.cnblogs.com/starof/p/4066381.html

冒泡流和捕获流

1.执行顺序不一样
2.参数不一样
3.事件加不加on
4.this指向问题

7、ajax请求的时候get 和post方式的区别

参考https://www.cnblogs.com/ranyonsue/p/5888692.html

8、call()和apply()的区别

简单来说两者都是功能一致，A.call(B,arg1,agr2,agr3) || A.apply(B(arguments))都是使用A方法调用B方法，但call参数不固定，apply只有两个参数，所以第二个参数为数组或类数组。
https://blog.csdn.net/ganyingxie123456/article/details/70855586

9、 json字符串转为json对象的方法及它们的区别

js自带了转换方法Json.parse()和Json.eval()方法，但eval()方法不会检测是否符合json格式一并转换，所以存在安全为题。
另外，json对象转化为json字符串用Json.stringify()
https://blog.csdn.net/u014558484/article/details/71683622

10、js怎么获取非行间样式？

【ie】return obj.currentStyle[name];
【firefox】return getComputedStyle(obj,false)[name];
https://blog.csdn.net/github_33261002/article/details/50889663

11、事件委托是什么原理，有何优点？

事件委托又称为事件代理，利用了事件冒泡的特点，将具有相同事件的元素的事件交给父级元素处理，这样就不需要为事件一个一个的绑定事件，也不需要每次添加新元素就重新绑定一次事件。
https://www.cnblogs.com/liugang-vip/p/5616484.html

12、闭包是什么，有什么特性，对页面有什么影响？（难点）

https://blog.csdn.net/gaoshanwudi/article/details/7355794
Javascript闭包的定义非常晦涩——闭包，是指语法域位于某个特定的区域，具有持续参照（读写）位于该区域内自身范围之外的执行域上的非持久型变量值能力的段落。这些外部执行域的非持久型变量神奇地保留它们在闭包最初定义（或创建）时的值（深连结）。
简单来说，Javascript闭包就是在另一个作用域中保存了一份它从上一级函数或作用域取得的变量（键值对），而这些键值对是不会随上一级函数的执行完成而销毁。周爱民说得更清楚，闭包就是“属性表”，闭包就是一个数据块，闭包就是一个存放着“Name=Value”的对照表。就这么简单。但是，必须强调，闭包是运行期概念，一个函数实例。
各种专业文献上的“闭包”（closure）定义非常抽象，很难看懂。我的理解是，闭包就是能够读取其他函数内部变量的函数。
由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。
闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。

13、如何阻止事件冒泡和默认事件

event.stopPropagation() || window.event.cancelBubble = true;
event.preventDefault() || window.event.returnValue = false;
http://caibaojian.com/javascript-stoppropagation-preventdefault.html

14、添加 删除 替换 插入到某个接点的方法

obj.appendChidl(newnode)
obj.innersetBefore(newnode,existingnode)
obj.replaceChild(newnode,oldnode)
obj.removeChild(node)

15、解释jsonp的原理，以及为什么不是真正的ajax？

Ajax请求受到同资源策略的影响，即请求域和接收域不同的话，ajax会报错，这是安全措施，但是如果我们想实现跨域读取信息应该怎么实现呢？我们知道