1、Web前端岗位面试题有哪些
1.对WEB标准以及W3C的理解与认识
标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性；
2.xhtml和html有什么区别
HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
最主要的不同：
XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。
3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?
用于声明文档使用那种规范（html/Xhtml）一般为 严格 过度 基于框架的html文档
加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug
4.行内元素有哪些?块级元素有哪些?CSS的盒模型?
块级元素：div p h1 h2 h3 h4 form ul
行内元素: a b br i span input select
Css盒模型:内容，border ,margin，padding
5.CSS引入的方式有哪些? link和@import的区别是?
内联 内嵌 外链 导入
区别 ：同时加载
前者无兼容性，后者CSS2.1以下浏览器不支持
Link 支持使用javascript改变样式，后者不可
6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?
标签选择符 类选择符 id选择符
继承不如指定 Id>class>标签选择
后者优先级高
7.前端页面有哪三层构成，分别是什么?作用是什么?
结构层 Html 表示层 CSS 行为层 js
8.css的基本语句构成是?
选择器{属性1:值1;属性2:值2;……}
9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?
Ie(Ie内核) 火狐（Gecko） 谷歌（webkit） opear(Presto)
10.写出几种IE6 BUG的解决方法
1.双边距BUG float引起的 使用display
2.3像素问题 使用float引起的 使用dislpay:inline -3px
3.超链接hover 点击后失效 使用正确的书写顺序 link visited hover active
4.Ie z-index问题 给父级添加position:relative
5.Png 透明 使用js代码 改
6.Min-height 最小高度 ！Important 解决’
7.select 在ie6下遮盖 使用iframe嵌套
8.为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）
11.标签上title与alt属性的区别是什么?
Alt 当图片不显示是 用文字代表。
Title 为该属性提供信息
12.描述css reset的作用和用途。
Reset重置浏览器的css默认属性 浏览器的品种不同，样式不同，然后重置，让他们统一
13.解释css sprites，如何使用。
Css 精灵 把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量
14.浏览器标准模式和怪异模式之间的区别是什么?
盒子模型 渲染模式的不同
使用 window.top.document.compatMode 可显示为什么模式
15.你如何对网站的文件和资源进行优化?期待的解决方案包括：
文件合并
文件最小化/文件压缩
使用CDN托管
缓存的使用
16.什么是语义化的HTML?
直观的认识标签 对于搜索引擎的抓取有好处
17.清除浮动的几种方式，各自的优缺点
1.使用空标签清除浮动 clear:both（理论上能清楚任何标签，，，增加无意义的标签）
2.使用overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE）
3.是用afert伪元素清除浮动(用于非IE浏览器)
Javascript
1.javascript的typeof返回哪些数据类型
Object number function boolean underfind
2.例举3种强制类型转换和2种隐式类型转换?
强制（parseInt,parseFloat,number）
隐式（== – ===）
3.split() join() 的区别
前者是切割成数组的形式，后者是将数组转换成字符串
4.数组方法pop() push() unshift() shift()
Push()尾部添加 pop()尾部删除
Unshift()头部添加 shift()头部删除
5.事件绑定和普通事件有什么区别
6.IE和DOM事件流的区别
1.执行顺序不一样、
2.参数不一样
3.事件加不加on
4.this指向问题
7.IE和标准下有哪些兼容性的写法
Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
8.ajax请求的时候get 和post方式的区别
一个在url后面 一个放在虚拟载体里面
有大小限制
安全问题
应用不同 一个是论坛等只需要请求的，一个是类似修改密码的
9.call和apply的区别
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
10.ajax请求时，如何解释json数据
使用eval parse 鉴于安全性考虑 使用parse更靠谱
11.b继承a的方法
12.写一个获取非行间样式的函数
function getStyle(obj,attr,value)
{
if(!value)
{
if(obj.currentStyle)
{
return obj.currentStyle(attr)
}
else
{
obj.getComputedStyle(attr,false)
}
}
else
{
obj.style[attr]=value
}
}
13.事件委托是什么
让利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！
14.闭包是什么，有什么特性，对页面有什么影响
闭包就是能够读取其他函数内部变量的函数。
15.如何阻止事件冒泡和默认事件
canceBubble return false
16.添加 删除 替换 插入到某个接点的方法
obj.appendChidl()
obj.innersetBefore
obj.replaceChild
obj.removeChild
17.解释jsonp的原理，以及为什么不是真正的ajax
动态创建script标签，回调函数
Ajax是页面无刷新请求数据操作
2、面试Web前端需要注意什么？会面试哪些问题？
作为一名HTML5前端工程师，为了工作，为了就业我们免不了要参加各种各样的面试。为此总结了面试前的注意事项：
第一：注意自己的仪容仪表
面试之前，一定要再次从头到脚地将自己的仪容仪表检查一遍。检查时主要包括，自己的牙缝是不是还有食物残渣，所以你需要就近找一个卫生间，如果没有卫生间就近找一个角落也是可以的，但是切记一定不要在大庭广众之下。因此，为了给自己整理出着装的时间请在约定时间前20分钟到达。
第二：再次检查面试时所需的资料是否都已带全
这些资料主要包括：身份证明、学历文凭证明、个人简历、以往作品等等，如果这些东西齐全之后，需要对这些资料做一个整理与排序。因为没有哪个面试官希望看到面试者拿出一堆“莫名其妙”的东西塞给他，让他自己再一页一页的翻找自己需要的内容，如果说这些资料在面试官手中不小心散落一地，结果可想而知。这样的求职者在面试官眼中也一定不是一个让人放心、有条不紊的员工。当然如果检查时发现资料没有带全，也不要紧张。反而你要庆幸幸亏及时检查，也有足够的时间组织语言去向面试官解释。
第三：面试之前将通信工具调成振动或关闭状态
虽然说面试者与面试官之间是一个平等的关系，但毕竟你是去人家公司求职的，始终处于一个被动的状态，所以最起码的尊重还是要做到的。曾经有调查显示，对于面试过程中接电话或是被电话打断的求职者，会被HR减分。
第四：等候面试官时，仔细观察多了解面试公司
在等候面试官时，可以暗自观察一下公司的大体情况比如员工的着装风格、公司的LOGO或是贴在墙上的企业文化、公司的环境等等，一来可以在接下来的面试过程中表现出自己对公司的认同感，二来也可以让自己对求职公司多些了解，以确定是否要接受这里的工作。如果你身边有公司的资料宣传架，不妨取一本翻看一下，也会增加HR对你的好感。
第五：放松心情，保持自信
面试时一定要保持一定的自信，这样也会给面试官留下很好的印象。面试只是你步入工作的第一步，即便是失败了那也是人生重要的经历。失败是为了更好的迎接下一个挑战。
作为一名web前端工程师千万不要觉得懂技术面试就能万事大吉了，像以上五点细节性的东西也是一定要掌握的。
面试题系列：
网页链接
3、如何面试网页设计？
看你做那个行业的网页设计了，现在网页设计需求比较多的，1.是网络公司，专门给人做网站的，一般以量为主，加班比较多，但是有提成，里面的设计师做到底也就设计部经理，然后慢慢升管理层，当然这要企业有空间升职的情况下来说的，也有做一辈子的网页设计的，和销售一样，已知最好赚的是中企，每个网站提成5%，厉害的设计师可以做到月收入上W。2.私企，为自己公司做网站并维护，包括一些购物网，一个网站重复鼓捣，对设计本身发展不利，工作相对轻松无压力，对员工要求比较全面，设计、切图甚至代码都要懂，做个两三年人是变全面了，但是设计水平无法提高，如果企业小的话对以后发展不好。3.广告公司，专门设计高端水平的网站，特别要求flash技术。加班是经常的，同时收入是丰富的。但是对平面设计也有要求，发展前景不错，但是能力不够的话压力不是一般的大
4、网页设计和前端携带的面试作品一般要到什么水准
TOPVE唯艺互动认为这个不同的公司要求也是不一样的，面试之前需要你先了解一下你所面试的公司的大概的情况是怎么样的，他们的网站或是产品的设计和前端水准在什么程度，那你你的作品水准只要跟他们的水准相差不是太大的话就没有什么问题了。
5、web前端面试经常问到的面试题有哪些
Web前端经常被问到的面试题及答案
一、HTML+CSS
1.对WEB标准以及W3C的理解与认识
标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外
链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维
护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;
2.xhtml和html有什么区别
HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
最主要的不同：
XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。
3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?
用于声明文档使用那种规范(html/Xhtml)一般为 严格 过度 基于框架的html文档
加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug
4.行内元素有哪些?块级元素有哪些?CSS的盒模型?
块级元素：div p h1 h2 h3 h4 form ul
行内元素: a b br i span input select
Css盒模型:内容，border ,margin，padding
5.CSS引入的方式有哪些? link和@import的区别是?
内联 内嵌 外链 导入
区别 ：同时加载
前者无兼容性，后者CSS2.1以下浏览器不支持
Link 支持使用javascript改变样式，后者不可
6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?
标签选择符 类选择符 id选择符
继承不如指定 Id>class>标签选择
后者优先级高
7.前端页面有哪三层构成，分别是什么?作用是什么?
结构层 Html 表示层 CSS 行为层 js
8.css的基本语句构成是?
选择器{属性1:值1;属性2:值2;……}
9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?
Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto)
二、Javascript
1.javascript的typeof返回哪些数据类型
Object number function boolean underfind
2.例举3种强制类型转换和2种隐式类型转换?
强制(parseInt,parseFloat,number)
隐式(== – ===)
3.split() join() 的区别
前者是切割成数组的形式，后者是将数组转换成字符串
4.数组方法pop() push() unshift() shift()
Push()尾部添加 pop()尾部删除
Unshift()头部添加 shift()头部删除
5.事件绑定和普通事件有什么区别
6.IE和DOM事件流的区别
1.执行顺序不一样、
2.参数不一样
3.事件加不加on
4.this指向问题
7.IE和标准下有哪些兼容性的写法
Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
8.ajax请求的时候get 和post方式的区别
一个在url后面 一个放在虚拟载体里面
有大小限制
安全问题
应用不同 一个是论坛等只需要请求的，一个是类似修改密码的
9.call和apply的区别
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
10.ajax请求时，如何解释json数据
使用eval parse 鉴于安全性考虑 使用parse更靠谱
11.b继承a的方法
12.写一个获取非行间样式的函数
function getStyle(obj,attr,value)
{
if(!value)
{
if(obj.currentStyle)
{
return obj.currentStyle(attr)
}
else
{
obj.getComputedStyle(attr,false)
}
}
else
{
obj.style[attr]=value
}
}
6、前端开发 面试作品，不知道具体有什么要求，是要以整个网站，还是几个、一个页面呢？
前台（端复）开发面试作品，一般对静制态和设计部分要求较高：
1、必要的网页布局和美术设计是必要的，在此，最好掌握HTML语言
2、CSS往往是必须要掌握的
3、JAVASCRIPT由于运行于前端，很多公司也会面试到这一部分，至少要了解
4、尽管你是应聘前端，但最好多少了解一些后台的工作
5、作品最好是个整站系统，或至少你参与的整站，你可以告诉老板，前台或静态部分，是你参入设计的
7、面试网页设计有哪些问题
一、网页设计面试的经典问题及答题思路：
问题一：“请你自我介绍一下”
思路：
1、这是面试的必考题目。
2、介绍内容要与个人简历相一致。
3、表述方式上尽量口语化。
4、要切中要害，不谈无关、无用的内容。
5、条理要清晰，层次要分明。
6、事先最好以文字的形式写好背熟。
回答要点：用10秒钟简单说说个人资料即可。用一分半钟左右时间介绍你以前从事的工作，和所获得的经验。再用一分钟左右时间描述你以前的工作经验对应聘的这份职位来说有那些帮助。
问题二：“谈谈你的家庭情况”
思路：
1、况对于了解应聘者的性格、观念、心态等有一定的作用，这是招聘单位问该问题的主要原因。
2、简单地罗列家庭人。
3、宜强调温馨和睦的家庭氛围。
4、宜强调父母对自己教育的重视。
5、宜强调各位家庭成员的良好状况。
6、宜强调家庭成员对自己工作的支持。
7、宜强调自己对家庭的责任感。
问题三：“你有什么业余爱好？”
思路：
1、业余爱好能在一定程度上反映应聘者的性格、观念、心态，这是招聘单位问该问题的主要原因。
2、最好不要说自己没有业余爱好。
3、不要说自己有那些庸俗的、令人感觉不好的爱好。
4、最好不要说自己仅限于读书、听音乐、上网，否则可能令面试官怀疑应聘者性格孤僻。
5、最好能有一些户外的业余爱好来“点缀”你的形象。
问题四：“你最崇拜谁？”
思路：
1、最崇拜的人能在一定程度上反映应聘者的性格、观念、心态，这是面试官问该问题的主要原因。
2、不宜说自己谁都不崇拜。
3、不宜说崇拜自己。
4、不宜说崇拜一个虚幻的、或是不知名的人。
5、不宜说崇拜一个明显具有负面形象的人。
6、所崇拜的人人最好与自己所应聘的工作能“搭”上关系。
7、最好说出自己所崇拜的人的哪些品质、哪些思想感染着自己、鼓舞着自己。
问题五：“你的座右铭是什么？”
思路：
1、座右铭能在一定程度上反映应聘者的性格、观念、心态，这是面试官问这个问题的主要原因。
2、不宜说那些医引起不好联想的座右铭。
3、不宜说那些太抽象的座右铭。
4、不宜说太长的座右铭。
5、座右铭最好能反映出自己某种优秀品质。
6、参考答案——“只为成功找方法，不为失败找借口”
二、面试的注意事项：
(1)一旦和用人单位约好面试时间后，一定要提前5-10分钟到达面试地点，以表示求职者的诚意，给对方以信任 感，同时也可调整自己的心态，作一些简单的仪表准备，以免仓促上阵，手忙脚乱。为了做到这一点，一定要牢 记面试的时间地点，有条件的同学最好能提前去一趟，以免因一时找不到地方或途中延误而迟到。如果迟到了， 肯定会给招聘者留下不好的印象，甚至会丧失面试的机会。
(2) 进入面试场合时不要紧张。 如门关着，应先敲门，得到允许后再进去。开关门动作要轻，以从容、自然为 好。见面时要向招聘者主动打招呼问好致意，称呼应当得体。在用人单位没有请你坐下时，切勿急于落座。用人 单位请你坐下时，应道声“谢谢”。坐下后保持良好体态，切忌大大咧咧，左顾右盼，满不在乎，以免引起反感 。离去时应询问“还有什么要问的吗”，得到允许后应微笑起立，道谢并说“再见”。
(3) 对用人单位的 问题要逐一回答。 对方给你介绍情况时，要认真聆听。为了表示你已听懂并感兴趣，可以在适当的时候点头或 适当提问、答话。回答主试者的问题，口齿要清晰，声音要适度，答话要简练、完整。一般情况下不要打断用人 单位的问话或抢问抢答，否则会给人急躁、鲁莽、不礼貌的印象。问话完毕，听不懂时可要求重复。当不能回答 某一问题时，应如实告诉用人单位，含糊其辞和胡吹乱侃会导致面试失败。对重复的问题也要有耐心，不要表现 出不耐烦。
(4) 在整个面试过程中，在保持举止文雅大方，谈吐谦虚谨慎，态度积极热情。 如果用人单位有两位以上主试 人时，回答谁的问题，你的目光就应注视谁，并应适时地环顾其他主试人以表示你对他们的尊重。谈话时，眼睛 要适时地注意对方，不要东张西望，显得漫不经心，也不要眼皮低望，显得缺乏自信，激动地与用人单位争辩某 个问题也是不明智的举动，冷静地保持不卑不亢的风度是有益的。有的用人单位专门提一些无理的问题试探你的 反应，如果处理不好，容易乱了分寸，面试的效果显然不会理想。
8、网页设计工作的面试如何回答..
一般HR会这样问：copy
1、以前在哪里做，担任什么职位，主要负责什么
2、为什么离开上家公司
3、是否不成功案例，你认为你的案例中哪个最好
4、最后会问你薪资问题。
这里我挑2、4来回答，其它的我相信你应该知道怎么回答。
对于第二个问题，很多HR都会问，这里你应该这样回答比较合适：从两方面，第一你可以说公司国转型做其它项目，不做我现在这一块的业务了。第二你可以说公司的发展方向与我的专业不太对，对我自己以后的发展不是很好，所以我想找一份与我专业对口的。
对于问题4，有可能是HR提出来，但也有可能没提，这里你应该提出来。怎么说没关系，说出你要的价位就行，他就会知道了。然后他会根据公司的情况和你提的价位来跟你说明。你可以看公司的办公环境以及员工的工作环境，就可以看出该公司老板是否有钱了，呵呵！深圳这边的网页设计薪资挺难说的，有高有低。关键还是看能力与沟通技巧了。
好了，以上是我个人经验，希望你能找到一份好工作，开心上班！
9、请问一下面试网页设计师要准备什么？面试时自我介绍该怎么说？面试官会问什么问题？
穿啥不重要，干净整洁就好了。招这个职位其实有两个方向：
如果对方则重设计感想招设计师的话，重点看你：作品设计风格是否成熟(就是玩ps的能力和你的美术底子)
如果人家不需要你设计，设计好了稿子丢给你，你的工作就只是搞切片、优化前端代码的话，人家看你：网页切片代码是否合理规范、搞不搞得定css兼容、js掌握得如何、独立解决技术问题的能力如何
不管看你上面，这行招聘最最重点会看你：有没有经验(书上说的学校教的东西和实际工作中用的完全是两回事)，一般不招生手，除非是低工资给老手当助理，或招实习生。
可能现场试试你做东西的速度或检验下你的设计能力
10、面试网页美工/网页设计师,我需要注意哪些问题?
如果这个岗位即是美工，又是设计师，那就说明这家公司不是特别大的公司，一般大的公司网页设计师和前端工程师是分开的，但是一些小的公司会把这两个职位合并到一起。具体需要注意的情节：
1、对这个岗位要有自己的理解，你要让领导知道你心目中的这个岗位是什么样子的，你对网页美工/网页设计师是怎么理解的；
2、表现出对企业的忠诚，比如问你一个为什么不在上一家企业工作了？你应该尽量避免说是自己浮躁，如果真是自己的原因，那也尽量表现出你会在这个企业长期待下去，没有公司愿意用三心二意的员工，有些时候忠诚比技能要重要；
3、尽量多带一些成熟的作品，企业用你当然和你的技能分不开，从你的作品中企业可以看出你的真是水平。
4、如果有别的公共活动的证书什么的尽量一并带上，这样可以给你加分；
5、尽量衣着得体，如果有条件尽量整装，这样可以显得你对这次面试的重视；
6、如果能留面试官的电话尽量留面试官的电话，如果面试官不打算用你，你可以多打几次电话争取一下这个岗位，让面试官看到你对这个岗位的渴望，不怕你不会，就怕你不做，一个很优秀但是不努力的人和一个很差劲但是很努力的人比，有些人还是比较喜欢后者的。
7、做足前期功课，要在去企业之前，对这个企业有了解，避免面试官问你关于这个行业的时候一问三不知的局面。