导航栏： 首页 评论列表

前端一些面试问题

默认分类 2011-04-27 20:30:35

转载:http://www.cnblogs.com/sweetie/archive/2010/12/07/1898567.html

1.javascript对象的几种创建方式

1．工厂方式

//定义
function createCar() {
var oCar = new Object();
oCar.color = "red";
oCar.doors = 4;
oCar.showColor = function() {
alert(this.color);
}
return oCar;
}
//调用
var ocar1 = createCar();
var ocar2 = createCar();
ocar1.color = "black";
ocar1.showColor();
ocar2.showColor();

修改createCar()函数，给它传递各个属性的默认值：

function createCar(sColor, iDoors, iMpg) {
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.mpg = iMpg;
oTempCar.showColor = function () {
alert(this.color);
};
return oTempCar;
}

var oCar1 = createCar("red", 4, 23);
var oCar2 = createCar("blue", 3, 25);
oCar1.showColor(); //outputs "red"
oCar2.showColor(); //outputs "blue"

在工厂函数外定义对象的方法，然后通过属性指向该方法，从而避免每次调用函数createCar()，都要创建新函数showColor()。

function showColor(){
alert(this.color);
}

function createCar(sColor, iDoors, iMpg){
var oTempCar = new Object;
oTempCar.color = sColor;
oTempCar.doors = iDoors;
oTempCar.mpg = iMpg;
oTempCar.showColor = showColor;
return oTempCar;
}

 2.构造函数方式

在构造函数内部无创建对象，而是使用this关键字。使用new运算符调用构造函数时，在执行第一行代码前先创建一个对象，只有用this才能访问该对象。然后可以直接赋予this属性，默认情况下是构造函数的返回值（不必明确使用return运算符）。

function Car(sColor, iDoors, iMpg) {
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.showColor = function() {
alert(this.color);
};
}
var oCar1 = new Car("red", 4, 23);
var oCar2 = new Car("blue", 3, 25);

3.原型方式

//定义
function Car() {
}
Car.prototype.color = "red";
Car.prototype.doors = 4;
Car.prototype.drivers = new Array("Tom", "Jerry");
Car.prototype.showColor = function() {
alert(this.color);
}
//调用：
var car1 = new Car();
var car2 = new Car();
car1.showColor();
car2.showColor();
alert(car1.drivers);
car1.drivers.push("stephen");
alert(car1.drivers); //结果：Tom,Jerry,stephen
alert(car2.drivers); //结果：Tom,Jerry,stephen

//可以用json方式简化prototype的定义:
Car.prototype = {
color: "red",
doors: 4,
drivers: ["Tom", "Jerry",'safdad'],
showColor: function() {
alert(this.color);
}
}

4.混合的构造函数/原型方式

用构造函数定义对象的所有非函数属性，用原型方式定义对象的函数属性(方法)。

//定义
function Car(color,doors) {
this.color=color;
this.doors=doors;
this.drivers=new Array("Tom","Jerry");
}

Car.prototype.showColor=function(){
alert(this.color);
}

//调用：
var car1=new Car('red',4);
var car2=new Car('blue',4);

car1.showColor();
car2.showColor();

alert(car1.drivers);
car1.drivers.push("stephen");
alert(car1.drivers); //结果：Tom,Jerry,stephen
alert(car2.drivers); //结果：Tom,Jerry
alert(car1 instanceof Car);

5.动态原型方法

function Car() {
this.color = "red";
this.doors = 4;
this.drivers = new Array("Tom", "Jerry");
if (typeof Car._initialized == "undefined") {
Car.prototype.showColor = function() {
alert(this.color);
}
//............
}
//最后定义
Car._initialized = true;
}

6.混合工厂方式

目的是创建假构造函数，只返回另一种对象的新实例。

function Car() {
var oTempCar = new Object();
oTempCar.color="red";
oTempCar.doors=4;
oTempCar.mpg=23;
oTempCar.showColor = function() {
alert(this.color);
}
return oTempCar;
}

//与经典方式不同，这种方式使用new运算符，使它看起来像真正的构造函数：
var oCar = new Car();

由于在Car()构造函数内部调用了new运算符，所以将忽略第二个new运算符（位于构造函数之外）。在构造函数内部创建的对象被传递回变量var。这种方式在对象方法的内部管理方面与经典方式有着相同的问题。强烈建议：除非万不得已，还是避免使用这种方式。
总结：（采用哪种方式)
目前使用最广泛的是混合的构造函数/原型方式。此外，动态原型方法也很流行，在功能上与构造函数/原型方式等价。可以采用这两种方式中的任何一种。不过不要单独使用经典的构造函数或原型方式，因为这样会给代码引入问题。

A.CSS部分

一.浏览器兼容性问题

1.各浏览器中 'width' 和 'height' 在某些元素上的作用位置有差异

  参考：http://www.w3help.org/zh-cn/causes/RD8001

2.IE6 中浮动元素在某些情况下会有双倍外边距

  参考：http://www.w3help.org/zh-cn/causes/RX1001

二.css层叠

  参考：http://www.w3help.org/zh-cn/kb/005/

三.CSS hack

  参考：http://www.w3help.org/zh-cn/causes/RY8003

          http://topic.csdn.net/u/20100715/17/6306e40a-1ea1-4f0f-a1c3-acd7470800ea.html?18677

四.CSS 框模型( Box module )

  参考：http://www.w3help.org/zh-cn/kb/006/

五.CSS 定位体系

  参考：http://www.w3help.org/zh-cn/kb/009/

B.javascript部分

一.函数表达式和函数声明

函数声明：直接声明一个函数 function fnName() {};function声明必须有方法名，而出现在表达式里的方法名都会被忽略。

函数表达式：通过赋值，将一个变量的引用指向一个指定的function或匿名函数

二.原型和原型链

三.作用域和作用域链和闭包

  参考：http://blog.belltoy.net/javascript_scope_call_object_closure.html

  参考：http://leeldy.blog.163.com/blog/static/13985306201061325918669/

四.闭包的用处

  参考：http://www.belltoy.net/useage-of-javascript-closure.html

C.HTML

一.document.body和document.documentElement比较

  参考：http://blog.csdn.net/wangjj_016/archive/2010/02/10/5304788.aspx

          http://j2ee-chenwei.javaeye.com/blog/460340

二.session和cookie

  参考：http://leeldy.blog.163.com/blog/static/139853062009013105945194/

DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。
DOM操作——怎样添加、移除、移动、复制、创建和查找节点。

1.创建新节点

  createDocumentFragment()

  createElement()

  createTextNode()

2.添加、移除、替换

  appendChild()

  removeChild()

  replaceChild()

  insertBefore()

3.查找

  getElementsByTagName()

  getElementsByName()

  getElementById()

---------------------------------------------------------------------
事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。

1.冒泡型事件：事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。

  IE 5.5: div -> body -> document

  IE 6.0: div -> body -> html -> document

  Mozilla 1.0: div -> body -> html -> document -> window

2.捕获型事件(event capturing)：事件从最不精确的对象(document 对象)开始触发，然后到最精确(也可以在窗口级别捕获事件，不过必须由开发人员特别指定)。

3.DOM事件流：同时支持两种事件模型：捕获型事件和冒泡型事件，但是，捕获型事件先发生。两种事件流会触及DOM中的所有对象，从document对象开始，也在document对象结束。

  DOM事件模型最独特的性质是，文本节点也触发事件(在IE中不会)。

------------------------------------------------------------------------

事件处理函数/监听函数

IE：

在IE中，每个元素和window对象都有两个方法：attachEvent()和detachEvent()。事件处理函数总是按照添加它们的顺序进行调用。

DOM：

DOM方法addEventListener()和removeEventListener()用来分配和移除事件处理函数。与IE不同，这些方法需要三个参数：事件名称，要分配的函数和处理函数是用于冒泡阶段还是捕获阶段。如果事件处理函数是用于捕获阶段，第三个参数为true；用于冒泡阶段，则为false。

如果使用addEventListener()将事件处理函数加入到捕获阶段，则必须在removeEventListener()中指明是捕获阶段，才能正确的将这个事件处理函数删除。

-------------------------------------------------------------------------------

事件对象

在IE中，事件对象是window对象的一个属性event，event对象只能在事件发生时访问。所有的事件处理函数执行完毕后，事件对象就被销毁。

DOM标准，event对象必须作为唯一的参数传递给事件处理函数。

区别：

1.获取目标：位于事件中心的对象称为目标

  在IE中，目标包含在event对象的srcElement属性中：var oTarget = oEvent.srcElement;

  在DOM兼容的浏览器中，目标包含在target属性中：var oTarget = oEvent.target;

2.获取字符代码

3.阻止某个事件的默认行为

  在IE中要阻止某个事件的默认行为，必须将returnValue属性设置为false：oEvent.returnValue = false;

  在Mozilla中，只要调用preventDefault()方法：oEvent.preventDefault();

 4.停止事件复制(冒泡)

  IE：oEvent.cancelBubble = true;

  mozilla: oEvent.stopPropagation();
------------------------------------------------------------------------------------------

XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。

XMLHttpRequest 对象提供了在网页加载后与服务器进行通信的方法。

 

<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url)
{
xmlhttp=null;
if (window.XMLHttpRequest)
{// code for all new browsers
xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{// code for IE5 and IE6
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
if (xmlhttp!=null)
{
xmlhttp.onreadystatechange=state_Change;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
else
{
alert("Your browser does not support XMLHTTP.");
}
}

function state_Change()
{
if (xmlhttp.readyState==4)
{// 4 = "loaded"
if (xmlhttp.status==200)
{// 200 = OK
// ...our code here...
}
else
{
alert("Problem retrieving XML data");
}
}
}
</script>

 

 

-------------------------------------------------------------------------------------------
严格模式与混杂模式——如何触发这两种模式，区分它们有何意义。

在标准模式中，浏览器根据规范呈现页面；

在混杂模式中，页面以一种比较宽松的向后兼容的方式显示。

浏览器根据DOCTYPE是否存在以及使用的哪种DTD来选择要使用的呈现方法。如果XHTML文档包含形式完整的DOCTYPE，那么它一般以标准模式呈现。对于HTML 4.01文档，包含严格DTD的DOCTYPE常常导致页面以标准模式呈现。包含过渡DTD和URI的DOCTYPE也导致页面以标准模式呈现，但是有过渡DTD而没有URI会导致页面以混杂模式呈现。DOCTYPE不存在或形式不正确会导致HTML和XHTML文档以混杂模式呈现。

-------------------------------------------------------------------------------------------
盒模型——外边距、内边距和边框之间的关系，IE 8以下版本的浏览器中的盒模型有什么不同。

 
块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。

 

浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。

 

HTML与XHTML——二者有什么区别，你觉得应该使用哪一个并说出理由。

 
JSON——它是什么、为什么应该使用它、到底该怎么使用它，说出实现细节来。

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。

JSON建构于两种结构：
“名称/值”对的集合（A collection of name/value pairs）。不同的语言中，它被理解为对象（object），纪录（record），结构（struct），字典（dictionary），哈希表（hash table），有键列表（keyed list），或者关联数组 （associative array）。
值的有序列表（An ordered list of values）。在大部分语言中，它被理解为数组（array）。

1.<img>元素的alt和title有什么异同
正确的使用alt text属性和title属性不仅可以提高图片的搜索能力，对用户体验上也是很有帮助。

 

alt text
替换文字（alt text）是为了给那些不能看到你文档中图像的浏览者提供文字说明。这包括那些使用本来

就不支持图像显示或者图像显示被关闭的浏览器的用户，视觉障碍的用户和使用屏幕阅读器的用户。所

以替换文字是用来替代图像而不是提供额外说明文字的。Alt text在IE浏览器中还起到了title的作用——鼠

标经过时的文字提示。IE浏览器给了大家一个误导，在IE中ALT会变成文字提示是因为IE不标准。这一

点Firefox做的就比较好。

title
title是对图片的说明和额外补充，如果需要在鼠标经过图片时出现文字提示应该用属性title。title属性的

优先级高于alt text。但由于错误的引导，很多初学者就在img标签内只加了alt属性。
1. alt text和title对访问者都很重要（alt text对搜索引擎会更重要一些），所以在定义img对象时，最好将

alt text和title属性都写全，保证在各种浏览器中都能正常使用。

2. 在alt text和title中包含关键字，并且二者内容最好不一样。

3. 不要在alt text和title中堆积关键字，否则可能会导致搜索引擎惩罚。

[HTML && CSS]
1.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?

<!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

该标签可声明三种 DTD 类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

当浏览器厂商开始创建与标准兼容的浏览器时，他们希望确保向后兼容性。为了实现这一点，他们创建了两种呈现模式：标准模式和混杂模式（quirks mode）。在标准模式中，浏览器根据规范呈现页面；在混杂模式中，页面以一种比较宽松的向后兼容的方式显示。混杂模式通常模拟老式浏览器（比如Microsoft IE 4和Netscape Navigator 4）的行为以防止老站点无法工作。

Mozilla和Safari还有第三种模式，称为”几乎标准的模式（almost standards mode）”，除了在处理表格的方式上有一些细微的差异之外，这种模式与标准模式相同。

如何触发这两种模式:

浏览器根据DOCTYPE是否存在以及使用的哪种DTD来选择要使用的呈现方法。如果XHTML文档包含形式完整的DOCTYPE，那么它一般以标准模式呈现。对于HTML 4.01文档，包含严格DTD的DOCTYPE常常导致页面以标准模式呈现。包含过渡DTD和URI的DOCTYPE也导致页面以标准模式呈现，但是有过渡DTD而没有URI会导致页面以混杂模式呈现。DOCTYPE不存在或形式不正确会导致HTML和XHTML文档以混杂模式呈现。

DOCTYPE切换是浏览器用来区分遗留文档和符合标准的文档的手段。无论是否编写了有效的CSS，如果选择了错误的DOCTYPE，那么页面就将以混杂模式呈现，其行为就可能会有错误或不可预测。因此，一定要在站点的每个页面上包含形式完整的DOCTYPE声明，并且在使用HTML时选择严格的DTD。

2：行内元素有哪些？块级元素有哪些？CSS的盒模型？

块元素(block element)
address - 地址
blockquote - 块引用
center - 举中对齐块
dir - 目录列表
div - 常用块级容易，也是CSS layout的主要标签
dl - 定义列表
fieldset - form控制组
form - 交互表单
h1 - 大标题
h2 - 副标题
h3 - 3级标题
h4 - 4级标题
h5 - 5级标题
h6 - 6级标题
hr - 水平分隔线
isindex - input prompt
menu - 菜单列表
noframes - frames可选内容，（对于不支持frame的浏览器显示此区块内容
noscript - 可选脚本内容（对于不支持script的浏览器显示此内容）
ol - 排序表单
p - 段落
pre - 格式化文本
table - 表格
ul - 非排序列表

内联元素(inline element)
a - 锚点
abbr - 缩写
acronym - 首字
b - 粗体(不推荐)
bdo - bidi override
big - 大字体
br - 换行
cite - 引用
code - 计算机代码(在引用源码的时候需要)
dfn - 定义字段
em - 强调
font - 字体设定(不推荐)
i - 斜体
img - 图片
input - 输入框
kbd - 定义键盘文本
label - 表格标签
q - 短引用
s - 中划线(不推荐)
samp - 定义范例计算机代码
select - 项目选择
small - 小字体文本
span - 常用内联容器，定义文本内区块
strike - 中划线
strong - 粗体强调
sub - 下标
sup - 上标
textarea - 多行文本输入框
tt - 电传文本
u - 下划线
var - 定义变量

      关于可变元素

      当块内元素和行内元素随环境而变化时，它就变成了可根据上下文关系确定该元素是块元素或者行内元素，即可变元素。可变元素还是属于上述两种元素类别，一旦上下文关系确定了他的类别，他就要遵循块元素或者内联元素的规则限制。

      可变元素有哪些呢？

      可变元素为根据上下文语境决定该元素为块元素或者内联元素。
　　◎ applet – java applet
　　◎ button – 按钮
　　◎ del – 删除文本
　　◎ iframe – inline frame
　　◎ ins – 插入的文本
　　◎ map – 图片区块(map)
　　◎ object – object对象
　　◎ script – 客户端脚本

盒模型：http://www.birdol.com/article/566.html

3.CSS引入的方式有哪些? link和@import的区别是?

参考：http://hi.baidu.com/dtdxrk/blog/item/65e83509ebdc4adf3ac763a3.html

 一、内联引用CSS
将STYLE属性直接加在个别的元件标签里，<元件(标签) STYLE="性质(属性)1: 设定值1; 性质(属性)2: 设定值2; ...}
例如：
<td style="color:#c00; font-size:15px; line-height:18px;>
模板无忧 - www.mb5u.com
</td>

这种方法优点：可灵巧应用样式於各标签中。方便于编写代码时的使用。
这种方法缺点：没有整篇文件的“统一性”，在需要修改某样式的时候也变的比较困难。
二、内部引用CSS
将样式规则写在<STYLE>...</STYLE>标签之中。
<STYLE TYPE="text/CSS">
<!--
样式规则表
-->
</STYLE>
通常是将整个的 <STYLE>...</STYLE>结构写在网页的<HEAD> </HEAD>部份之中。
这种方法的优点：整篇文章有了统一性，只要是有声明的的元件即会套用该样式规则。
这种方法的缺点：个别元件的灵活度不足，整站的功能性较弱。
三、外部引用 link 标签引用CSS
将样式规则写在.css的样式文件中，再以<link>标签引入。
假设我们把样式规则存成一个example.css的档案，我们只要在网页中加入：
　　<link rel=stylesheet type="text/css" href="example.css">

这样引入该css样式表文件以后，就可以直接套用该样式档案中所制定的样式了。 通常是将link标签写在网页的<head></head>部份之中。
这种方法的优点：可以把要套用相同样式规则的数篇文件都指定到同一个样式文件中，可以进行统一的修改，也便于整站的设置有统一的风格。
一般css网页布局都使用此种方法。
这种方法的缺点：在个别文件或元素的灵活度不足。
四、外部引用 @import 引用CSS
跟link方法很像，但必须放在<STYLE>...</STYLE> 中：
<STYLE TYPE="text/css">
<!--
@import url(引入的样式表的位址、路径与档名);
-->
</STYLE>
例如：
<STYLE TYPE="text/css">
<!--
@import url(css/example.css);
-->
</STYLE>
要注重的是，行末的分号是必须的！千万不能漏写！
这种方法的优点：可以灵活的引入css文件对xhtml元素进行控制。有时候也用来编写某些css hack。
这种方法的缺点：在个别文件或元素的灵活度不足。

区别参考：http://www.js8.in/554.html

隶属上的差别

link属于XHTML标签，而@import完全是CSS提供的一种方式。link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义RSS，定义rel连接属性等，@import就只能加载CSS了。此处注意浏览器的link src为空时候时会导致页面加载次数增多。

@import次数限制

传闻在IE6下，@import只能引入31次css文件，可是可以通过在css文件中再次import来垂直扩展，断桥残雪没有测试过，不过如果出现这样的情况，说明这个写代码的人也挺变态的。

加载顺序的不同

当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS文件会同时被加载，而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式，然后突然样式会出现，网速慢的时候还挺明显，@import这点跟把CSS文件放在页面结尾效果相同，不过如果我们一些样式开始页面并不会出现，而是在交互时才出现的CSS样式，可以通过这个方法引入，时间上错开。例如：Ajax的html，交互时的弹出框，弹出div等

兼容性上的差别

由于@import是CSS2.1提出的，@import只有在IE5以上的才能识别，而link标签无此问题（似乎影响不大~）。

使用DOM控制样式时的差别

当使用javascript控制DOM(document.styleSheets)去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的。

所以，无特殊情况推荐使用link来引入样式，尽量避免使用@import，而如果进行Ajax或者交互的样式，则可以通过@import引入

4.CSS选择符有哪些？哪些属性可以继承？优先级算法如何计算？内联和important哪个优先级高？

     ID 和 CLASS
　　Class 可继承
　　伪类A标签可以继承
　　列表 UL LIDL DD DT可继承

     有一些属性不能被继承，如：border, margin, padding, background等。
　　优先级就近原则，样式定义最近者为准
　　载入样式以最后载入的定位为准
　　优先级为

     HTML标记的权重是1,CLASS的权重是10,ID的权重是100，继承的权重为0（后面会讲到）。
　　!important > [ id > class > tag ]
　　Important 比内联优先级高

5:前端页面有哪三层构成，分别是什么？作用是什么？

网页的结构层（structural layer）由 HTML 或 XHTML 之类的标记语言负责创建。标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含任何关于如何显示有关内容的信息。例如，P 标签表达了这样一种语义：“这是一个文本段。”

网页的表示层（presentation layer） 由 CSS 负责创建。 CSS 对“如何显示有关内容”的问题做出了回答。

网页的行为层（behavior layer）负责回答“内容应该如何对事件做出反应”这一问题。这是 Javascript 语言和 DOM 主宰的领域。

6:css的基本语句构成是？

选择器{属性1:值1;属性2:值2;……}

8：你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?经常遇到的浏览器的兼容性有哪些？怎么会出现？解决方法是什么？

浏览器和内核参考：http://neolee.com/pc/several-browser-core-introduction/

IE、Opera、Firefox、Safari、The World还有现在的Chrome等

那内核是什么呢？内核只是一个通俗的说法，其英文名称为“Layout engine”，翻译过来就是“排版引擎”，也被称为“页面渲染引擎”（下文中各种说法通用）。它负责取得网页的内容（HTML、XML、图像等等）、整理信息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要排版引擎。

 

现在市面上常见的 内核基本是一下4种：
Trident：

这是微软开发的一种排版引擎。该内核程序在1997年的IE4中首次被采用，是微软在Mosaic代码的基础之上修改而来的，并沿用到目前的 IE7。Trident实际上是一款开放的内核，其接口内核设计的相当成熟，因此才有许多采用IE内核而非IE的浏览器涌现（如 Maxthon、The World 、TT、GreenBrowser、AvantBrowser等）。此外，为了方便也有很多人直接简称其为IE内核（当然也不排除有部分人是因为不知道内 核名称而只好如此说，至少老N就是如此。。。）。自从发布后，Trident不断地被更新和完善：

Trident II（IE5）——增进对CSS1.0的支持及对CSS2重大的变更；

Trident III（IE5.5）——修正部分CSS的排版控制；

Trident IV（IE6）——修正了一部分box-model的错误以及增加了“兼容模式（Quirks Mode）”切换功能，以增加对文件类型描述（Document Type Definition，DTD）的支持；

Trident V（IE7）——修正许多CSS排版处理上的错误以及增加对PNG格式alpha通道（半透明）的支持。（这就是IE6经常被诟病的对png图片支持不良的之处！）

Geckos：

Gecko是套开放源代码的、以C++编写的网页排版引擎。这软件原本是由网景通讯公司开发的，Netcape6开始采用该内核。后来的 Mozilla FireFox也采用了该内核，Geckos的特点是代码完全公开，因此，其可开发程度很高，全世界的程序员都可以为其编写代码，增加功能。Geckos 现在由Mozilla基金会维护。

Presto：

Presto是一个由Opera Software开发的浏览器排版引擎，该内核在2003年的Opera7中首次被使用，该款引擎的特点就是渲染速度的优化达到了极致，也是目前公认网页浏览速度最快的浏览器内核。

Webkit：

苹果公司自己的内核，也是苹果的Safari浏览器使用的内核。 Webkit引擎包含WebCore排版引擎及JavaScriptCore解析引擎，均是从KDE的KHTML及KJS引擎衍生而来，它们都是自由软 件，在GPL条约下授权，同时支持BSD系统的开发。所以Webkit也是自由软件，同时开发源代码。在安全方面不受IE、Firefox的制约，所以 Safari浏览器在国内还是很安全的。

简单的总结一下：

使用Trident内核的浏览器：IE、Maxthon、TT、The World等；

使用Gecko内核的浏览器：Netcape6及以上版本、FireFox、MozillaSuite/SeaMonkey；

使用Presto内核的浏览器：Opera7及以上版本；

使用Webkit内核的浏览器：Safari、Chrome。

 
9.如何居中一个浮动元素?

10.有没有关注HTML5和CSS3?如有请简单说一些您对它们的了解情况！

    参考：http://zh.wikipedia.org/zh/HTML_5

11.你怎么来实现下面这个设计图,主要讲述思路 （效果图省略）

13:如果让你来制作一个访问量很高的大型网站，你会如何来管理所有CSS文件、JS与图片？

14：你对前端界面工程师这个职位是怎么样理解的？它的前景会怎么样？


>> 留言评论