HTMLDoctype作用? 严格模式与混杂模式如何区分?它们有何意义?
行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
link 和@import 的区别是?
浏览器的内核分别是什么?
常见兼容性问题?
background-color:#f1ee18;/*所有识别*/ .background-color:#00deff\9; /*IE6、7、8识别*/ +background-color:#a200ff;/*IE6、7识别*/ _background-color:#1e0bd1;/*IE6识别*/ }
html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?
<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script> <![endif]-->
语义化的理解?
HTML5的离线储存? local
(写)描述一段语义的html代码吧。
iframe有那些缺点?
请描述一下 cookies,sessionStorage 和 localStorage 的区别?
如何实现浏览器内多个标签页之间的通信?
webSocket如何兼容低浏览器? Adobe CSS介绍一下CSS的盒子模型?
CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3新增伪类有那些? * *
*
*
*
优先级为:
CSS3新增伪类举例: p:first-of-type p:last-of-type p:only-of-type p:only-child p:nth-child(2) :enabled :checked 如何居中div?如何居中一个浮动元素? 给div设置一个宽度,然后添加margin:0 auto属性 div{ width:200px; margin:0 auto; }
居中一个浮动元素
Width:500px ; height:300px;//高度可以不设 Margin: -150px 0 0 -250px; position:relative;相对定位 background-color:pink;//方便看效果 left:50%; top:50%;}
列出display的值,说明他们的作用。position的值, relative和absolute定位原点是?
CSS3有哪些新特性?
你怎么来实现页面设计图,你认为前端应该如何高质量完成工作? 一个满屏 品 字布局 如何设计?
常使用的库有哪些?常用的前端开发工具?开发过什么应用或组件?
经常遇到的CSS的兼容性有哪些?原因,解决方法是什么? 为什么要初始化CSS样式。 - -
absolute的containing block计算方式跟正常流有什么不同? position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样? 对BFC规范的理解?
css定义的权重
/*权重为1*/div{}/*权重为10*/.class1{}/*权重为100*/#id1{}/*权重为100+1=101*/#id1
解释下浮动和它的工作原理?清除浮动的技巧 浮动元素脱离文档流,不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。技巧: 1.使用空标签清除浮动。 这种方法是在所有浮动标签后面添加一个空标签 定义css clear:both. 弊端就是增加了无意义标签。 2.使用overflow。 给包含浮动元素的父标签添加css属性 overflow:auto; zoom:1; zoom:1用于兼容IE6。 3.使用after伪对象清除浮动。 该方法只适用于非IE浏览器。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置 height:0,否则该元素会比实际高出若干像素; 4.在html页面添加:<div class=’clear’></div> 用过媒体查询,针对移动端的布局吗? 用过 @media screen and (min-width:480px){ } 使用 CSS 预处理器吗?喜欢那个? 三款 CSS 预处理器框架,分别是 Sass、Less CSS、Stylus。 喜欢哪个?Sass 什么是CSS预处理器? CSS 预处理器是一种语言用来为 CSS 增加一些编程的的特性,无需考虑浏览器的兼容性问题,例如你可以在 CSS 中使用变量、简单的程序逻辑、函数等等在编程语言中的一些基本技巧,可以让你的 CSS 更见简洁,适应性更强,代码更直观等诸多好处。 title和alt区别? alt属性的功能是不能显示图像信息时候的替换文字(即在图片显示的位置上显示文字,说明这个图片的要显示的内容)。Alt属性值的长度必须少于100个英文字符。 title属性可以用在除了base,basefont,head,html,meta,param,script和title之外的所有标签。 title属性的功能是提示。额外的说明信息和非本质的信息请使用title属性。title属性值可以比alt属性值设置的更长。 title属性有一个很好的用途,即为链接添加描述性文字,特别是当连接本身并不是十分清楚的表达了链接的目的。这样就使得访问者知道那些链接将会带他们到什么地方,他们就不会加载一个可能完全不感兴趣的页面。另外一个潜在的应用就是为图像提供额外的说明信息,比如日期或者其他非本质的信息。 解释css sprites,如何使用。CSS Sprite 又叫CSS精灵,是目前大型网站中经常运用的图片处理方式。它的原理很简单,将网站上零散的小图片(或图标)整合在一张大图上,再用CSS中“background-image”属性来定位图片的X/Y轴位置,从而减轻服务器对图片的请求数量,提高网页加载速度。因为对于当前大多数网速而言,不高于200KB的单张图片所需载入时间基本是差不多的,如果页面上有20张小图片或图标,那么服务器会载入20次。但使用CSS Sprite将图片整合成一张大图后,服务器只需要载入一次就够了,很大程度上优化了图片加载速度,这在门户型网站尤为明显。 CSS Sprites优点1.利用CSS Sprites能很好地减少了网页的http请求,从而大大的提高了页面的性能,这也是CSS Sprites最大的优点,也是其被广泛传播和应用的主要原因; 2.CSS Sprites能减少图片的字节,曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。解决了网页设计师在图片命名上的困扰,只需对一张集合的图片上命名就可以了,不需要对每一个小元素进行命名,从而提高了网页的制作效率。 3.更换风格方便,只需要在一张或少张图片上修改图片的颜色或样式,整个网页的风格就可以改变。维护起来更加方便。 CSS Sprites缺点1.在图片合并的时候,你要把多张图片有序的合理的合并成一张图片,还要留好足够的空间,防止板块内不会出现不必要的背景;这些还好,最痛苦的是在宽屏,高分辨率的屏幕下的自适应页面,你的图片如果不够宽,很容易出现背景断裂; 2.CSS Sprites在开发的时候比较麻烦,你要通过photoshop或其他工具测量计算每一个背景单元的精确位置,这是针线活,没什么难度,但是很繁琐;幸好腾讯的鬼哥用RIA开发了一个CSS Sprites 样式生成工具,虽然还有一些使用上的不灵活,但是已经比photoshop测量来的方便多了,而且样式直接生成,复制,拷贝就OK! 3.CSS Sprites在维护的时候比较麻烦,如果页面背景有少许改动,一般就要改这张合并的图片,无需改的地方最好不要动,这样避免改动更多的css,如果在原来的地方放不下,又只能(最好)往下加图片,这样图片的字节就增加了,还要改动css。 22.在书写高效css文件时会有哪些问题需要考虑
JavaScript JavaScript原型,原型链 ? 有什么特点?
eval是做什么的?
null,undefined 的区别? 写一个通用的事件侦听器函数。
Node.js的适用场景?
介绍js的基本数据类型。
Javascript如何实现继承?
["1", "2", "3"].map(parseInt) 答案是多少?
如何创建一个对象? (画出此对象的内存图)
谈谈This对象的理解。 this
this 事件是?IE与火狐的事件机制有什么区别? 如何阻止冒泡?
什么是闭包(closure),为什么要用它?
闭包就是能够读取其他函数内部变量的函数, 可以把闭包简单理解成"定义在一个函数内部的函数"。 闭包的用途:①可以读取函数内部的变量②可以让变量始终保持在内存中 闭包的优点: (1)由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。 (2) 闭包会在父函数外部,改变父函数内部变量的值。不要随便改变父函数内部变量的值。
new操作符具体干了什么呢?
var
Javascript中,有一个函数,执行时对象查找时,永远不会去查找原型,这个函数是? hasOwnProperty JSON 的了解? JSON
js延迟加载的方式有哪些?
ajax 是什么? Ajax是什么:AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。 ajax 是什么?ajax 的交互模型?同步和异步的区别?如何解决跨域问题?
待完善
ajax的缺点
跨域: jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面
同步和异步的区别? 同步是指: 发送方发出数据后,等接收方发回响应以后才发下一个数据包的通讯方式。
如何解决跨域问题?
模块化怎么做? 立即执行函数,不暴露私有成员
异步加载的方式有哪些?
documen.write和 innerHTML的区别 document.write只能重绘整个页面 innerHTML可以重绘页面的一部分 .call() 和 .apply() 的区别?
{
Jquery与jQuery UI 有啥区别?
jquery 中如何将数组转化为json字符串,然后再转化回来? jQuery中没有提供这个功能,所以你需要先编写两个jQuery的扩展:
针对 jQuery 的优化方法?
那些操作会造成内存泄漏?
set
如何判断当前脚本运行在浏览器还是node环境中?
请写出一个获取5位数随机数的方法,要求最大数字不超过99999
{ var Range = Max - Min; var Rand = Math.random(); return(Min + Math.round(Rand * Range)); } var num = GetRandomNum(1,99999); alert(num);写一个时钟:格式为hh mm ss <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>简易网页时钟</title> <style> body,div{margin:0;padding:0;} body{color:#fff;font:16px/1.5 \5fae\8f6f\96c5\9ed1;} #clock{width:300px;text-align:center;background:#1a1a1a;margin:10px auto;padding:20px 0;} span{color:#000;width:80px;line-height:2;background:#fbfbfb;border:2px solid #b4b4b4;margin:0 10px;padding:0 10px;} </style> <script> window.onload = function () { var oClock = document.getElementById("clock"); var aSpan = oClock.getElementsByTagName("span");
setInterval(getTimes, 1000); getTimes(); function getTimes () { var oDate = new Date(); var aDate = [oDate.getHours(), oDate.getMinutes(), oDate.getSeconds()]; for (var i in aDate) aSpan[i].innerHTML = format(aDate[i]) } function format(a) { return a.toString().replace(/^(\d)$/, "0$1") } } </script> </head> <body> <div id="clock"> <span></span>点<span></span>分<span></span>秒 </div> </body> </html>
4、如何阻止冒泡和默认事件? 通过使用 preventDefault() 方法只取消默认的行为。 .代码如下:
通过使用 stopPropagation() 方法只阻止一个事件起泡。 .代码如下:
19.请指出“get()”“[]”“eq()”的区别? 答:仔细查看下API文档就可以知道。eq返回的是一个jquery对象,get返回的是一个html 对象数组。举个例子: <p style 使用eq来获得第一个p标签的color值: $ 使用get来获得第一个p标签的color值: $ 当然,你也可以get(num)后把对象转为jq的对象再进行操作: $
答:选择器(字符串),HTML(字符串),回调函数,HTML元素,对象,数组,元素数组,jQuery对象等。 对Node的优点和缺点提出了自己的看法:
其他问题对Node的优点和缺点提出了自己的看法?
你有哪些性能优化的方法?
http状态码有那些?分别代表是什么意思?
一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?(流程说的越详细越好)
对前端界面工程师这个职位是怎么样理解的?它的前景会怎么样?
平时如何管理你的项目?
说说最近最流行的一些东西吧?常去哪些网站?
移动端(Android IOS)怎么做好用户体验?
|
前端页面有哪三层构成,分别是什么?作用是什么?
最准确的网页设计思路是把网页分成三个层次,即:结构层、表示层、行为层。
网页的结构层(structural layer)由 HTML 或 XHTML 之类的标记语言负责创建。标签,也就是那些出现在尖括号里的单词,对网页内容的语义含义做出了描述,但这些标签不包含任何关于如何显示有关内容的信息。例如,P 标签表达了这样一种语义:“这是一个文本段。”
网页的表示层(presentation layer) 由 CSS 负责创建。 CSS 对“如何显示有关内容”的问题做出了回答。
网页的行为层(behavior layer)负责回答“内容应该如何对事件做出反应”这一问题。这是 Javascript 语言和 DOM 主宰的领域。
页面重构怎么操作?
编写 CSS、让页面结构更合理化,提升用户体验,实现良好的页面效果和提升性能。
网站为什么要进行重构(网站重构的好处)
a、使页面加载得更快速;
b、降低带宽带来的费用:节约成本;
c、让你在修改设计时更有效率而代价更低;
d、帮助你的整个站点保持视觉的一致性;
e、更利于搜索引擎的检索(符合SEO的规范);
f、令站点更容易被各种浏览器和用户访问(包括手机、PDA和残障人士使用的文字浏览器);
g、兼容不容忽视的Mozilla系浏览器(Firefox份额);
h、提高你的职场竞争实力(事实上也就是降低失业的风险)。
什么叫优雅降级和渐进增强?
优雅降级:Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题,针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案,使之在旧式浏览器上以某种形式降级体验却不至于完全失效.
渐进增强:从被所有浏览器支持的基本功能开始,逐步地添加那些只有新式浏览器才支持的功能,向页面增加无害于基础浏览器的额外样式和功能的。当浏览器支持时,它们会自动地呈现出来并发挥作用。
WEB应用从服务器主动推送Data到客户端有那些方式?
html5 websoket
WebSocket
通过Flash
XHR
长时间连接
XHR Multipart Streaming
不可见的Iframe
<script>
标签的长时间连接(可跨域)
html,xhtml,xml的区别介绍
html(超文本标记语言)——xhtml(可扩展性超文本标记语言)——xml(可扩展性标记语言);
html:
1.对大小写不敏感;
2.标签不必成对出现;
3.<br>;
xhtml:
1.对大小写敏感,必须是小写的;
2.标签必须成对出现,有开始标签就必须有结束标签;
3.属性值必须在引号之内;
4.不支持属性最小化:
eg:正确:<input checked='checked'>
错误:<input checked>
5.name属性不赞成使用,以后会被淘汰;
6.空元素也要结束标签:如:<br/>,<hr/>(水平分割线)
xml:
html最终会发展到xml,xhtml是html想xml发展的一个过渡,xhtml的特性也适合xml;