（2）严格模式排版和JS运行模式按照浏览器支持的最高标准运行。
(3)混合模式下，页面以松散的向后兼容方式显示。模拟旧版浏览器的行为以防止网站无法工作。
(4)DOCTYPE不存在或者格式不正确，会导致文档以混合模式渲染。
2. 什么是行内元素？什么是块级元素？
(1)CSS规范规定每个元素都有一个display属性，它决定了元素的类型。每个元素都有一个默认显示值。例如div的默认显示属性值为“block”，成为“块级”元素； span 默认的显示属性值为“inline”，即“内联”元素。
（2）行内元素包括：a b span img input select Strong（强调音） 块级元素包括：div ul ol li dl dt dd h1 h2 h3 h4…p
3. link和@import有什么区别？
（1）link属于XHTML标签，@import由CSS提供；
（2）页面加载时，链接会同时加载，@import引用的CSS会等到页面加载完成后再加载；
（3）Import只能被IE5以上识别，并且link是XHTML标签，所以不存在兼容性问题；
(4)链接样式style的权重高于@import的权重。
4.浏览器的核心是什么？
IE浏览器的Trident、Mozilla的Gecko、Chrome的Blink（WebKit的一个分支）、Opera的内核原来是Presto，现在是Blink；
5. HTML5有哪些新特性？ HTML5新标签如何处理浏览器兼容性问题？如何区分HTML和HTML5？
HTML5不再是SGML的子集，它主要是增加了图像、位置、存储、多任务等功能。
画布用于本地离线存储视频和音频元素以进行媒体播放。 localStorage长期存储数据，浏览器关闭后数据不丢失； sessionStorage数据在浏览器关闭后会自动删除。具有更好语义的内容元素，例如文章、页脚、页眉、导航、部分表单控件、日历、日期、时间、电子邮件、url、搜索新技术webworker、websockt、Geolocation
6.你如何理解语义？
用正确的标签做正确的事！
HTML语义是对页面内容进行结构化，使其能够方便地被浏览器和搜索引擎解析；也可以以不带CCS样式的文档格式显示，易于阅读。搜索引擎爬虫依靠标签来确定各个关键字的上下文和权重，这有利于SEO。它使阅读源代码的人更容易将网站划分为多个块，使其更易于阅读、维护和理解。
7、HTML5中离线存储有几种方法？
localStorage长期存储数据，浏览器关闭后数据不丢失； sessionStorage数据在浏览器关闭后会自动删除。
8. iframe有什么缺点？
iframe会阻塞主页面的Onload事件；
iframe和主页面共享连接池，浏览器对同域的连接有限制，所以会影响页面的并行加载。使用iframe 之前有两个缺点需要考虑。如果需要使用iframe，最好通过javascript动态给iframe添加src属性值，这样可以规避上面两个问题。
9. 请描述cookies、sessionStorage和localStorage之间的区别？
Cookie 在浏览器和服务器之间来回传递。 sessionStorage和localStorage没有，sessionStorage和localStorage的存储空间更大； sessionStorage和localStorage具有更丰富且易于使用的接口； sessionStorage和localStorage具有独立的存储空间；
10. 什么是CSS 选择器？哪些财产可以继承？优先级算法是如何计算的？ CSS3 中新的伪类是什么？
1.id 选择器(# myid) 2. 类选择器(.myclassname)
3. 标签选择器(div, h1, p) 4. 相邻选择器(h1 + p)
5. 子选择器(ul li) 6. 后代选择器(li a)
7. 通配符选择器(*) 8. 属性选择器(a[rel='external'])
可继承样式：font-size font-family color、UL LI DL DD DT；
不可继承的样式：border padding margin width height；
优先原则是就近原则。重量相同的情况下，以最接近的款式定义为准；
加载样式以上次加载定位为准；
优先级是：
!important id 类标签important 的优先级高于内联
11. CSS3中新的伪类的例子：
p:first-of-type 选择作为其父元素的第一个元素的每个元素。
p:last-of-type 选择作为其父元素的最后一个元素的每个元素。
p:only-of-type 选择作为其父元素的唯一元素的每个元素。
p:only-child 选择作为其父元素的唯一子元素的每个元素。
p:nth-child(2) 选择作为其父元素的第二个子元素的每个元素。
:enabled :disabled 控制表单控件的禁用状态。
:checked 单选按钮或复选框已选中。
12. 如何让div居中？如何使浮动元素居中？
设置div的宽度，然后添加margin:0 auto属性
div{ 宽度：200px; margin:0 自动； } 将浮动元素居中
确定容器宽高500，高度300。设置底层外边距.div { Width:500px; height:300px;//高度不需要Margin: -150px 0 0 -250px;位置：相对；相对定位background-color:pink;//方便看效果left:50 %;顶部：50%;}
列出显示值并描述其功能。位置、相对、绝对定位原点的值分别是多少？
1.block像块类型元素一样显示。无默认值。像内联元素类型一样显示。 inline-block 显示像内联元素，但其内容显示像块类型元素。 list-item 像块类型元素一样显示，并添加样式列表标记。
2.absolute：生成一个绝对定位的元素，相对于第一个父元素定位而不是静态定位。
固定（旧版IE 不支持）生成绝对定位元素，相对于浏览器窗口定位。
relative 生成相对定位的元素，相对于其正常位置定位。
继承指定position属性的值是从父元素继承的。
13. 为什么要初始化CSS样式？
由于浏览器兼容性问题，不同浏览器对某些标签的默认值是不同的。如果CSS没有初始化，经常会出现浏览器之间的页面显示差异。当然，初始化风格会对SEO产生一定的影响，但鱼与熊掌不可兼得，而是尽量以影响最小的方式进行初始化。最简单的初始化方法是： * {padding: 0; margin: 0;}（不推荐）淘宝风格初始化：body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd , ul, ol, li, pre, form, fieldset,图例、按钮、输入、文本区域、th、td { margin:0;填充：0； }正文、按钮、输入、选择、文本区域{ font:12px/1.5tahoma、arial、/5b8b/4f53; }h1、h2、h3、h4、h5、h6{ 字体大小：100%; }地址、引用、dfn、em、var { font-style:normal; }code, kbd, pre, samp { font-family:couriernew, courier, 等宽字体； }小{ 字体大小：12px; }ul, ol { 列表样式：none; }a { 文本装饰：none; }a:hover { 文本装饰：underline; }sup { 垂直对齐：text-top; }sub{ 垂直对齐：text-bottom; }图例{ color:#000; }字段集，img { border:0; }按钮、输入、选择、文本区域{ font-size:100%; }表{ border-collapse:collapse;边框间距：0； }
14. css定义的权重
以下是权重规则：label的权重为1，class的权重为10，id的权重为100。下面的例子演示了各种定义的权重值： /* Weight is 1*/div{}/*权重为10 */.class1{}/*权重为100*/#id1{}/*权重为100+1=101*/#id1 div{}/*权重为10+1=11*/.class1 div{}/*权重为10+10+1=21*/.class1 .class2 div{} 如果权重相同，则采用最后定义的样式，但这种情况应该避免
15、CSS3有哪些新特性？
CSS3实现圆角(border-radius:8px)、阴影(box-shadow:10px)、文字特效(text-shadow,)、线性渐变(gradient)、旋转(transform)transform:rotate(9deg)scale(0.85,0.90)translate( 0px,-30px) skew(-9deg,0deg);//旋转、缩放、定位、倾斜添加更多CSS选择器多背景rgba
16.介绍一下CSS盒子模型？
（1）有两种类型，IE盒模型和标准W3C盒模型； IE的内容部分包括border和padding；
(2)盒子模型：内容、填充、边距、边框。
17.对WEB标准和W3C的理解和理解？
18.XHTML和HTML有什么区别？
HTML是一种基本的WEB网页设计语言，XHTML是一种基于XML的标记语言。主要区别是：
XHTML 元素必须正确嵌套。
XHTML 元素必须关闭。标签名称必须为小写字母。
XHTML 文档必须有一个根元素。
19.文档类型？严格模式和混杂模式——如何触发这两种模式，区分它们的意义是什么？
20.什么是行内元素？什么是块级元素？ CSS的盒子模型？
块级元素：div p h1 h2 h3 h4 形式ul
内联元素： a b br i span 输入选择
CSS 盒模型： 内容、边框、边距、填充
21.CSS有哪些引入方式？链接和@import 有什么区别？
内嵌嵌入外部链接导入
区别：前者同时加载时不兼容，后者不支持CSS2.1以下的浏览器。
Link支持使用javascript改变样式，后者不能
22.什么是CSS选择器？哪些属性可以继承？优先级算法是如何计算的？内联优先级和重要优先级哪个优先级更高？
标签选择器类选择器id 选择器
继承不如指定Idclass标签选择
后者具有更高的优先级
23、前端页面分为哪三层？这些是什么？它们的作用是什么？
结构层HTML 表现层CSS 行为层js
24.CSS的基本语句结构是什么？
选择器{属性1:值1;属性2: 值2；…}
25. 您创建的页面在哪些浏览器中进行了测试？这些浏览器的核心是什么？
Ie (Ie 内核) Firefox (Gecko) Google (webkit) opear (Presto)
26.写几个解决IE6 BUG的方法
使用display3浮动引起的双边距BUG 使用dislpay:inline -3px使用浮动引起的像素问题超链接点击后悬停无效使用正确的书写顺序链接访问过悬停activeIe z-index问题将position:relativePng透明添加到父级使用js代码更改Min-height最小高度！重要解决ie6下使用iframe嵌套'select的问题。为什么我不能定义一个1px左右的宽度容器（IE6默认行高导致，使用over:hidden，zoom:0.08 line-height:1px）ie 6不支持！important27。 img 标签上的title 和alt 属性有什么区别？
Alt 当图片不显示时，用文字表示。
标题提供了该房产的信息
28、描述css重置的功能和使用。
Reset 重置浏览器的css 默认属性。浏览器不同，有不同的风格。然后重置它们，使它们统一。
29.解释CSS精灵以及如何使用它们。
CSS向导将一堆小图像集成为一个大图像，以减少服务器图像请求的数量。
30.浏览器标准模式和怪异模式有什么区别？
盒模型渲染模式差异
使用window.top.document.compatMode 显示什么模式
31. 你们如何优化网站的文件和资源？预期的解决方案包括：
文件合并
文件最小化/文件压缩
使用CDN 托管
缓存使用情况
32.什么是语义HTML？
直观的标签识别有利于搜索引擎抓取
33.清除漂浮物的几种方法，各有优缺点
1.使用空标签清除浮动clear:both（理论上可以清除任意标签，添加无意义标签） 2.使用overflow:auto（空标签元素清除浮动，不得不添加无意识的代码，使用zoom:1以兼容IE） 3.使用afert伪- 清除浮动的元素（对于非IE 浏览器）
34.javascript的typeof返回哪些数据类型？
对象编号函数布尔underfind35。举例说明3 种强制类型转换和2 种隐式类型转换？
强制（parseInt，parseFloat，数字）
隐式(=====) 36. split() join() 的区别
前者被切割成数组，后者用于将数组转换为字符串。 37. 数组方法pop() push() unshift() shift()
Push() 在末尾添加pop() 在末尾删除
Unshift() 头部添加shift() 头部移除
39.IE和DOM事件流的区别
1、执行顺序不同，
2.参数不同
3. 是否添加事件
4.this指出了问题
40.IE与标准兼容的编写方式有哪些？
var target=ev.srcElement||ev.target41.ajax请求时get和post方法的区别
一个位于url 后面，另一个位于虚拟载体内。
有尺寸限制
安全问题
应用不同。一种是针对论坛等只需要请求的应用程序，另一种是类似于更改密码。 42.call和apply的区别
Object.call(this,obj1,obj2,obj3)Object.apply(this,arguments)43.ajax请求时如何解释json数据
使用eval parse 出于安全考虑，使用parse更可靠44.什么是闭包，它有什么特点，对页面有什么影响？
闭包是一个可以读取其他函数内部变量的函数。 46. 节点的添加、删除、替换和插入方法
obj.appendChidl()obj.innersetBeforeobj.replaceChildobj.removeChild47。讲解jsonp的原理以及为什么它不是真正的ajax
动态创建脚本标签和回调函数
Ajax是一种没有页面刷新请求的数据操作
48.javascript本地对象、内置对象和宿主对象
本地对象如array obj regexp 等可以用new 实例化
load Math 等内置对象无法实例化。
宿主就是浏览器自带的文档、窗口等。 50.“==”和“===”的区别
前者会自动转换类型
后者不会51.javascript 的同源策略
54.CSS定位方式有哪些？ position属性的值有哪些？它们之间有什么区别？ CSS中的定位内容为：position:relative |绝对|静态| fixedstatic 没有特殊设置，遵循基本定位规定，不能通过z-index进行分层分级。
相对不会脱离文档流。通过上、下、左、右定位来指自身的静态位置，并可以通过z-index进行分层分级。
Absolute 脱离了文档流，通过顶部、底部、左侧和右侧进行定位。选择其最近的父定位元素。当父位置为静态时，绝对元素将定位在主体坐标原点，并且可以通过z-index 进行分层分级。
固定就是固定定位。这里固定的对象是可视窗口而不是主体或父元素。可以通过z-index来进行层次分类。 55.定义函数有哪几种方式？
function a(){},var a=function(){} 56.如何定义对象？
a=new Object(), a={} 57.类定义方法（原型）（继承）
var a=function(){}a.prototype={}new a();58.该关键字的点
obj.foo()==obj //方法调用方式，this指向objfoo()==window; //函数调用方式，this指向windowowew obj.foo()==obj //构造函数调用方式，this指向new Create对象
foo.call(obj)==obj;//应用调用方式，this指向obj59。异步ajax有哪些优点和缺点？
优势：
与同步ajax相比：不会导致UI卡顿，用户体验好。
与刷新页面相比，节省流量
缺点：
返回按钮无效；
当同时触发多个请求时，由于回调时间不确定，会出现混乱。避免这种混乱需要复杂的判断机制。
对搜索引擎不友好
数据安全60.介绍js的基本数据类型。
数字、字符串、布尔值、对象、未定义
61.Javascript如何实现继承？
通过原型和构造函数
62.如何创建对象？ （画出这个对象的内存映射）
function Person(姓名， 年龄) { this.name=姓名； this.age=年龄； this.sing=function() { 警报(this.name) } }
63.谈谈对This对象的理解。
这是js中的一个关键字。该值会随着函数在不同情况下的使用而变化。但有一个总的原则，那就是this指的是调用该函数的对象。一般情况下：这是全局对象Global。作为方法调用，那么this指的是这个对象
64.什么是活动？ IE和Firefox的事件机制有什么区别？如何停止冒泡？
（1）我们在网页上执行的一次操作（有些操作对应多个事件）。例如：当我们点击一个按钮时，就会产生一个事件。是JavaScript 可以检测到的行为。
（2）事件处理机制：IE是事件冒泡，Firefox是事件捕获；
(3) ev.stopPropagation();
65、如何判断一个对象是否属于某个类？
使用instanceof（待改进）if(ainstanceofPerson){alert('yes'); }
66. 在Javascript中，有一个函数在执行过程中搜索对象时永远不会搜索原型。这个功能是什么？
拥有自己的财产
67.你了解JSON吗？
JSON（JavaScript 对象表示法）是一种轻量级数据交换格式。它基于JavaScript 的一个子集。数据格式简单，易于读写，占用带宽小{'age':'12', 'name':'back'}
68、简述src和href的区别
href 指向网络资源的位置，在当前元素（锚点）或当前文档（链接）之间建立链接，用于超链接。
src 指的是外部资源的位置，指向的内容会嵌入到文档中当前标签的位置；当请求src资源时，它所指向的资源会被下载并应用到文档中，比如js脚本、img图片、frames等元素。当浏览器解析这个元素时，会暂停其他资源的下载和处理，直到该资源被加载、编译和执行。对于图片、框架等元素也是如此，类似于将指向的资源嵌入到当前标签中。这也是为什么js脚本放在底部而不是头部的原因。
69.简述同步和异步的区别
同步是阻塞模式，异步是非阻塞模式。
同步是指进程在执行请求时，如果该请求需要一段时间才能返回信息，那么该进程会等到收到返回信息后才继续执行；
异步是指进程不需要永远等待，而是继续执行后面的操作，而不管其他进程的状态如何。当消息返回时，系统会通知进程去处理，这样可以提高执行效率。
70.px和em的区别
px 和em 都是长度单位。不同的是px的值是固定的。你指定什么就什么，计算也比较容易。 em的值不固定，em会继承父元素的字体大小。
浏览器默认字体高度为16px。所以未经调整的浏览器符合： 1em=16px。那么12px=0.75em，10px=0.625em
71.什么是优雅降级和渐进增强？
渐进增强：
针对低版本浏览器构建页面，保证最基本的功能，然后针对高级浏览器完善效果、交互、添加功能，以达到更好的用户体验。
优雅降级优雅降级：
从一开始就构建完整的功能，然后使其与旧版浏览器兼容。
区别：
一个。优雅降级是从复杂的现状出发，试图减少用户体验的供给
b.渐进增强从非常基本的功能版本开始，并不断扩展以满足未来环境的需求。
c.退化（功能衰退）意味着回顾；渐进增强意味着向前看，同时确保其基础处于安全区域
72.浏览器的核心是什么？
IE:三叉戟内核
火狐浏览器：gecko 内核
Safari：webkit 内核
Opera：以前是presto内核，但Opera现在已经改用Google Chrome的Blink内核。
Chrome：Blink（基于webkit，由Google和Opera Software联合开发）
73. 如何消除数组中的重复元素？
var arr1=[1,2,2,2,3,3,3,4,5,6],arr2=[];for(var i=0,len=arr1.length; i len; i++){if (arr2.indexOf(arr1[i]) 0){arr2.push(arr1[i]);}}document.write(arr2); //1,2,3,4,5,674。 Javascript 数组中什么是伪数组？如何将伪数组转换为标准数组？
伪数组（类似数组）：您不能直接调用数组方法，也不能期望length 属性产生任何特殊行为，但您仍然可以使用真正的数组遍历方法来遍历它们。经典的
型的是函数的argument参数，还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。 function log(){ var args = Array.prototype.slice.call(arguments); //为了使用unshift数组方法，将argument转化为真正的数组 args.unshift('(app)'); console.log.apply(console, args); }; 75、Javascript中callee和caller的作用？ caller是返回一个对函数的引用，该函数调用了当前函数； callee是返回正在被执行的function函数，也就是所指定的function对象的正文。 76、请描述一下cookies，sessionStorage和localStorage的区别 sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。
用户评论
看了这15道前端面试题，感觉自己又复习了一遍基础知识，虽然有些问题还是不太懂，但至少方向对了。
有6位网友表示赞同！
这15个面试题真的挺全的，准备面试的时候可以重点看看，希望对大家都有帮助！
有13位网友表示赞同！
15道题里，有几个感觉挺难的，特别是那个关于事件冒泡的，谁能解释一下吗？
有5位网友表示赞同！
前端面试题（15）？这数量是不是有点多？我有点担心看不完啊。
有17位网友表示赞同！
这些题目都很实用，如果能在面试前多做几遍，应该能提高不少信心。
有5位网友表示赞同！
15道题，每一道都让我感觉自己在前端的道路上还有很长的路要走。
有8位网友表示赞同！
这15个题目真是经典中的经典，收藏了，以后面试的时候用得上。
有20位网友表示赞同！
前端面试题（15）？我觉得应该是15个必考点，不然怎么叫面试题呢？
有7位网友表示赞同！
看了这些题目，感觉自己离高手又近了一步，加油！
有20位网友表示赞同！
题目挺不错的，但有些题目的答案解析太简略了，希望能详细一点。
有11位网友表示赞同！
这15个问题都是我面试时遇到的，感觉这个博主真的挺有经验的。
有19位网友表示赞同！
前端面试题（15）？我觉得这个标题有点误导，其实这些题目都不算特别难。
有13位网友表示赞同！
题目难度适中，但有些概念性的东西还是不太懂，希望有高手能解答一下。
有15位网友表示赞同！
15道题，每个都认真看了，感觉收获颇丰，谢谢分享！
有9位网友表示赞同！
前端面试题（15）？我觉得这个标题有点标题党，但内容还不错。
有17位网友表示赞同！
题目挺有用的，但我感觉如果能结合实际案例来讲解，可能更容易理解。
有11位网友表示赞同！
这15个面试题，我准备打印出来，每天背几题，希望面试能顺利。
有9位网友表示赞同！
前端面试题（15）？我觉得这个数量有点少，希望能看到更多类似的内容。
有6位网友表示赞同！
题目都很实用，但是感觉有些题目的答案解析不够清晰，希望能改进。
有16位网友表示赞同！