前端面试题一

CSS 选择题 

简答题  

1 、  HTML 中定义表格的宽度的时候  80PX 与 80% 的区别是什么   

Px表示像素，% 表示站整个也面宽度的百分比

 2 、   简述  DIV 元素和 SPAN 元素的区别。   

DIV默认状况下是分行显示， SPAN在同行显示

 3 、  CSS+DIV 开发  Web 页面的优点有哪些？   

优势：  

1）div+css ，这个网页设计模式中， div承担了网页的内容，css承担了网页的样式。这样就使网页的内容和样式的分离开来。有利于页面的维护升级。  

2）有助于提升搜索引擎亲和力（快速找到须要的数据，而不是像在 table中一层层的查找） 

3）有助于页面的重构(换皮肤如 blog，直接套用另一套样式就能够实现，而不用改动网页脚本。 ) 

缺点：开发效率比较低  

4 、   有关  CSS 浏览器兼容的一道面试题    

请写出一段代码实现以下效果：在老的浏览器里面显示一段蓝色文字，新浏览器里面则显示成红色的，在 IE6里面显示成绿的，IE7里面显示成黑色的  由于这个问题不是很严谨，只给出可能的答案：

 #content p{color:blue} 

html>body #content p {color:red}

 * html #content p{color:green} 

html>body #content p {*color:black;} 

*的涵意：因为不一样的浏览器对 CSS的支持及解析结果不同，还因为 CSS中的优先级的关系。咱们就能够根据这个来针对不一样的浏览器来写不一样的 CSS。这种方式称之为CSS Hack。

CSS Hack大体有3 种表现形式， CSS类内部Hack 、选择器 Hack以及HTML 头部引用 (if IE)Hack，CSS Hack 主要针对类内部 Hack：好比 IE6 能识别下划线 "_"和星号" * " ，IE7能识别星号 " * "，但不能识别下划线"_"，而 firefox两个都不能认识。

选择器 Hack：好比 IE6 能识别*html .class{}， IE7能识别*+html .class{} 或者*:first-child+html .class{}。

HTML头部引用(if IE)Hack ：针对全部 IE：<!--[if IE]><!-- 您的代码 --><![endif]-->，针对IE6 及如下版本： <!--[if lt IE 7]><!--您的代码--><![endif]--> ，这类Hack不只对 CSS生效，对写在判断语句里面的全部代码都会生效。

书写顺序通常是将识别能力强的浏览器的  CSS 写在前面，如：

好比要分辨 IE6和firefox 两种浏览器，能够这样写：

div{

background:green;/*forfirefox*/

*background:red;/*forIE6*/(bothIE6&&IE7)

}

在IE6中看到是红色的，在 firefox中看到是绿色的。

在firefox中，因为不识别 *号标识，因而将以星号开头的样式过滤掉，不予理睬，解析获得的结果是 :div{background:green},因而理所固然这个div的背景是绿色的。

在IE6中，两个 background样式都能识别出来，解析获得的结果是 :div{background:green;*background:red;}，因而根据优先级别，处在后面的 red的优先级高，因此div的背景颜色就是红色的。

CSS hack:区分IE6 ，IE7， firefox

区别 IE6与FF ：

background:orange;*background:blue;

区别 IE6与IE7 ：

background:green!important;background:blue;

区别 IE7与FF ：

background:orange;*background:green;

区别 FF，IE7 ，IE6：

background:orange;*background:green;_background:blue;

background:orange;*background:green!important;*background:blue;

注： IE都能识别*; 标准浏览器 (如FF) 不能识别 *；

IE6能识别* ；不能识别 !important;

IE7能识别* ，能识别 !important;

FF不能识别* ，但能识别 !important;

浏览器优先级别  :FF<IE7<IE6,CSS hack 书写顺序通常为 FF IE7 IE6

以: " #demo {width:100px;} "为例;

#demo {width:100px;} /* 被FIREFOX,IE6,IE7执行 .*/

* html #demo {width:120px;} /* 会被IE6执行 ,以前的定义会被后来的覆盖 ,因此#demo 的宽度在 IE6就为120px; */

*+html #demo {width:130px;} /* 会被IE7执行 */

因此最后 ,#demo的宽度在三个浏览器的解释为 : FIREFOX:100px; ie6:120px; ie7:130px;

IE8  最新 css hack ：

"\9"  　例 :"border:1px \9;". 这里的 "\9" 能够区别全部  IE 和 FireFox. （只针对  IE9 Hack ）

"\0"  　 IE8 识别， IE6  、 IE7 不能 .

"*"  　 IE6 、 IE7 能够识别 .IE8 、  FireFox 不能 .

"_"  　 IE6 能够识别 "_",IE7  、 IE8 、 FireFox  不能 .

5 、  Position 的值有哪几种？默认值又是什么？   

1. position 的五种值都是什么？ static, relative, absolute, fixed, inherit
2. position 的缺省值是什么？  Static

6 、   超连接访问事后  hover 样式就不出现的问题 ? 

被点击访问过的超连接样式不在具备 hover和active 了,解决方法是改变 CSS属性的排列顺序: L-V-H-A 

7 、  IE6 的双倍边距  BUG 

例如 : 

<style type=”text/css”> body {margin:0} 

div { float:left; margin-left:10px; width:200px; height:200px; border:1px solid red } </style> 

浮动后原本外边距 10px,但IE 解释为20px,解决办法是加上 display:inline

 8 、   为何  FF 下文本没法撑开容器的高度  ? 

标准浏览器中固定高度值的容器是不会象 IE6里那样被撑开的,那我又想固定高度，又想能被撑开须要怎样设置呢？办法就是去掉 he ight设置min-height:200px;  这里为了照顾不认识 min-height的IE6  能够这样定义：  

div { height:auto!important; height:200px; min-height:200px; } 

9 、   为何  web 标准中 IE 没法设置滚动条颜色了  ? 

原来样式设置：  

<style type=”text/css”> 

body { scrollbar-face-color:#f6f6f6; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#eeeeee;scrollbar-3dlight-color:#eeeeee; scrollbar-arrow-color:#000;scrollbar-track-color:#fff; scrollbar-darkshadow-color:#fff; } </style> 

解决办法是将 body换成html 

10 、为何没法定义 1px 左右高度的容器 ? 

IE6下这个问题是由于默认的行高形成的，解决的方法也有不少，例如： overflow:hidden | zoom:0.08 | line-height:1px

 11 、怎么样才能让层显示在  FLASH 之上呢 ? 

解决的办法是给 FLASH设置透明: 

<param name=”wmode” value=”transparent” />

12 、怎样使一个层垂直居中于浏览器中  ? 

<style type=”text/css”> <!– div { 

position:absolute; top:50%; left:50%; 

margin:-100px 0 0 -100px; width:200px; height:200px; border:1px solid red; } –> </style> 

这里使用百分比绝对定位，与外补丁负值的方法，负值的大小为其自身宽度高度除以二  

13 、 firefox 嵌套  div 标签的居中问题的解决方法   

假定有以下状况：  <div id=”a ”> <div id=” b”> </div> </div> 

若是要实现 b在a 中居中放置，通常只需用 CSS设置a 的text-align属性为 center。这样的方法在IE里看起来一切  正常；可是在Firefox中 b却会是居左的。 

解决办法就是设置 b的横向margin 为auto。例如设置 b的CSS 样式为： margin: 0 auto;。 

14 、 FireFox 浏览器是否支持  VBScript 脚本？  

不支持  

15 、咱们如今使用的 IE 的版本通常是多少， IE 的英文全称是什么？  

Internet Explorer 6.0 SP2/5.5/5.0/6.0 SP1/7.0 beta2/7.0 beta3 都算对。  

16 、 CSS 规范中，每一条样式的结束符是  ; （分号）仍是 :  （冒号）    ？样式名与样式值之间的 分隔符是: （冒号）仍是 =（等号）  ？ 

;，: 和=均可以

17 、 CSS 规范中，  . （句点）后面跟一个名称表明什么含义？  # （井号）后面跟一个名称表明

什么含义？若是要对一个元素设置 CSS样式，应将CSS 样式写在它的什么属性内？  

后面跟个名称表示文档中全部 class属性值包含这个名称的应用其后样式， #后面跟个名称表示文档中 ID为此名称的元素应用其后样式。

 18 、什么是 CSS ？它的能作些什么？    

CSS就是一种叫作样式表（stylesheet）的技术。也有的人称之为层叠样式表（ Cascading Stylesheet）。在主页制做时采用CSS技术，能够有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。  只要对相应的代码作一些简单的修改，就能够改变同一页面的不一样部分，或者页数不一样的网页的外观和格式。  它的做用能够达到： 

（1）在几乎全部的浏览器上均可以使用。  

（2）之前一些非得经过图片转换实现的功能，如今只要用 CSS就能够轻松实现，从而更快地下载页面。  

（3）使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目。  （4 ）你能够轻松地控制页面的布局  。 

（5）你能够将许多网页的风格格式同时更新，不用再一页一页地更新了。你能够将站点上全部的网页风格都使用一个 CSS文件进行控制，只要修改这个 CSS文件中相应的行，那么整个站点的全部页面都会随之发生变更。  

19 、 CSS 指的是什么  ? 在网页制做中为何要使用  CSS 技术 ? 

CSS(Cascading Style Sheets) 也叫层叠样式表，它是用来控制网页中一个或多个元素的外观。在网页制做中，使用样式表能够减小不少具备相同外观元素的重复设置工做，从而给网页的设计和维护带来了很大的方便 ;具体应用是：改变样式表中元素显示样式的定义，则在使用该样式表的全部网页中相应元素的显示样式都会自动发生改变。       

编程题

JavaScript 选择题 

20 、如下哪条语句会产生运行错误：（  A ）  

A、 var   obj   =   (   ); B 、 var   obj   =   [   ]; C 、 var   obj   =   {   }; D 、 var   obj   =   /   /; 

21 、如下哪一个单词不属于  javascript 保留字：（ B ）  

A、 with B 、 parent C、  class D、 void 

22 、请选择结果为真的表达式：（  C ）  

A、 null   instanceof   Object B 、 null   ===   undefined C、 null   ==   undefined D 、 NaN   ==   NaN  

23 、请选择对 javascript 理解有误的： (ABCD) 

A、 JScript 是javascript的简称  

B、 javascript 是网景公司开发的一种 Java脚本语言，其目的是为了简化 Java的开发难

度 C、  FireFox和IE 存在大量兼容性问题的主要缘由在于他们对 javascript的支持不一样上 D、  AJAX技术必定要使用javascript技术  

24 、 foo 对象有  att 属性，那么获取 att 属性的值，如下哪些作法是能够的：（  ACE ）  

A、 foo.att B 、 foo(“ att”) C 、 foo[“ att”] D 、 foo{“ att”} E 、 foo[“ a”+ ”t” +”t ”]

25 、在不指定特殊属性的状况下，哪几种  HTML 标签能够手动输入文本：（  AB ）  

A、 <TEXTAREA></TEXTAREA> B 、 <INPUT   type=”text ”/> C、  <INPUT   type=”hidden ”/> D、  <DIV></DIV> 

26 、如下哪些是 javascript 的全局函数：（ ABC ）   

A、 escape B 、 parseFloat C、  eval D、 setTimeout E 、 alert 

27 、关于 IFrame 表述正确的有：  (ABCD) 

A、  经过IFrame，网页能够嵌入其余网页内容，并能够动态更改  B、  在相同域名下，内嵌的 IFrame能够获取外层网页的对象  C、  在相同域名下，外层网页脚本能够获取 IFrame网页内的对象 D、  能够经过脚本调整IFrame的大小  

28 、关于表格表述正确的有：（  ABCDE ）  

A、  表格中能够包含 TBODY元素 B 、 表格中能够包含 CAPTION元素 C 、 表格中能够包含多个 TBODY元素 D 、 表格中能够包含 COLGROUP元素 E 、 表格中能够包含 COL元素 

29 、关于 IE 的  window 对象表述正确的有：（  ACD ）  

A、 window.opener 属性自己就是指向 window对象

 B、 window.reload() 方法能够用来刷新当前页面  

C、 window.location= ”a.html”和 window.location.href=”a.html ”的做用都是把当前页

面替换成 a.html页面

 D、  定义了全局变量 g；能够用window.g 的方式来存取该变量

简答题  

30 、如何让一个页面每 20 秒钟刷新一次而不用 Javascript?  

可使用 meta refresh标签来进行刷新。meta 标签是属于 HTML文档的<head> 部分。 例如： <meta http-equiv=”refresh ” content=” 20″>  以下代码实现用 meta标签将页面转发到一个新的页面：  

<meta http-equiv= ”refresh”  content=”2;url=http://www.mianwww.com ”>

 31 、 HTML 的几种触发都是什么？    

onblur 事件会在对象失去焦点时发生。

 onchange  事件会在域的内容改变时发生。

 onclick 事件会在对象被点击时发生。  

onfocus 事件在对象得到焦点时发生。  

onkeydown 事件会在用户按下一个键盘按键时发生。

 onkeypress  事件会在键盘按键被按下并释放一个键时发生。

 onkeyup 事件会在键盘按键被松开时发生。  

onmousedown 事件会在鼠标按键被按下时发生。

 onmousemove  事件会在鼠标指针移动时发生。  

onmouseout 事件会在鼠标指针移出指定的对象时发生。

 onmouseup  事件会在鼠标按键被松开时发生。

 32 、说一下 javascript 中  this 的用法   

一般状况下 , this表明的是前面提到的Globle Object.也就是 Browser环境时的window Object.  当function做为某一对象的  method 时, this  表明这个  function 所属的 object.  下面这段代码有格错误 , 涉及到this 的使用:

 function Employee(a) { 

this.name = a; 

}

function init(){ 

John = Employee(”Johnson”);

 alert(John.name);

 } 

在init()中咱们少了一个 new keyword. 因而这个代码就会报错, 由于 Browser把Employee 看成是window obect的一个 method, 里面的this 指的就是 window object. init()应该改成:

 function init(){ 

John = new Employee(”Johnson”);

 alert(John.name);

 } 

同时咱们也能够将 Employee的constructor 函数修改 , 防止相似的错误: 

function Employee(a) { 

if (!(this instanceof Employee)) 

return new Employee(a);

 this.name = a;

 }

33 、介绍一下 javascript 中 function  的用法   

在 JavaScript中 , function是一种数据类型, 全部的 function都是从buildin 的Function object 衍生的对象 . 因此在JavaScript  中function能够做为参数传递 , 能够做为Object 的property, 也能够看成函数返回值 . function在JavaScript 中有两种用法 , 一种是看成constructor,  前面加上 new keyword用来创建对象. 一种是看成 method, 为其余对象调用. 

注意 function和method 在中文里的意思至关 , 在有些语言里也能够通用 . 可是在 JavaScript 中, 它们仍是有所区别的 . function自己是是一个对象, 而看成为一个方法他属于一个对象时 , 就成为了一个这个对象的  method, 至关于一个对象种的属性 . 也就是说method 是相对于一个对象而言的 , function在某些状况下成为了一个对象的  method. 

34 、 JavaScript 面试  - 介绍一下 JavaScript 中的对象。   

JavaScript中的Object 是一组数据的 key-value的集合,  有点相似于  Java中的HashMap,  全部这些数据都是 Object里的property.  一般状况下 , JavaScript中创建一个对象用”new”加上 constructor function来实现.  如new Date(), new Object()等. 

var book = new Object(); 

book.name = “JavaScript is Cool”;

book.author = “tom”; book.pages = 514; 

上面例子中的 name和page 就是名为 book的对象中的property.  咱们能够用 delete来删除Object 中的 property: “ delete book.name;”.  除了Object, Date等 buildin的对象外,  咱们能够写本身的  constructor function, 而后使用new 就能够创建本身的对象 . 如上面的book 能够写成 :

 function Book (name, author, page) { 

this.name = name;

 this.author = author;

 this.page = page; 

} 

var abook = new Book( ”JavaScript is Cool” , “tom ”, 514); 

35 、介绍一下 JavaScript 中的循环引用   

在JavaScript中，当一个 DOM对象包含了一个JavaScript对象的引用 (好比一个事件的function), 同时那个 JavaScript的对象又包含了一个这个 DOM对象的引用，这样就形成了一个循环引用的结构。例如  

var s = document.createElement(’span’);  document.body.appendChild(s);     

s.onclick=function (){

 s.style.backgroundColor = ‘red’; 

 alert(n); 

}; 

36 、结合 text 这段结构，谈谈  innerHTML outerHTML innerText  之间的区别。   

innerHTML对象里面的HTML,outerHTML 包括对象和里面的  innerText对象里面的文本  

37 、 settimeout 与  setinteval  的区别？  

Settimeout只执行一次 setInteval 没有次数限制  

38 、生成 1-6 之间的整数？   

var NowFrame; 

NowFrame=Math.random( )*6+1 // 随机生成一个 1-6之间的小数

NowFrame=parseInt(NowFrame) // 把1-6之间的小数转化为整数

39 、请简述 javascript 脚本的执行原理。   

（1）浏览器接收用户的请求  

（2）向服务请求某个包含 avascript脚本的页面 

（3）应用服务器端向浏览器发送煤响应的消息。  

40 、如何让一个 DIV 隐藏起来，如何让一个曾显示出来   

Diasplay属性设置成none 

41 、 isNaN 的做用   

判断是否为数字  

42 、 JAVASCRIPT 中获取某个元素的方式   

Document.getElementById();  此方法在页面中搜索  Document.myform.xxx 此方法按照层次结构来获取  Document.getElementsByName() 此方法用于得到全部的名字相同的元素  

43 、 JAVASCRIPT 如何弹出一个模式对话框   

window.showModalDialog( “”) 

44 、在作浮动广告的时候如何把  DIV 层漂起来  

style=”position:absolute;” 

45 、如何用 JavaScript 隐藏一个超级连接真实的地址？    

代码示例以下：  

<a onMouseOver= ’window.status=” http://www.merchant-url-here.com”; return true; ’ onMouseOut=’ window.status=”Done ”; return true;’  href=”http://www.affiliate-url-here.com ” target=” _blank”>Link Text Here</a>

 46 、请写出一个 JavaScript  对象并初始化几个属性   

代码以下：  

var obj = { 

name: “ IT公司面试手册”,

address: “http://www.mianwww.com”, 

outfit: { top: “naked”, bottom: “jeans”, shoes: “hiking sho” }

 } 

47 、 Javascript 面试题：如何给一个  Javascript 的对象属性赋值？如何取得属性值？    

一个 Javascript对象的属性能够用”.”操做符或者数组方式来设置和取得：

代码以下：  

obj.name =  “IT公司面试手册” ;

 obj["name"] =  “IT公司面试手册” ; 

取得  属性的值： var myname = obj.name; var myname = obj["name"]; 

两种方法的区别是若是属性的名字若是是保留字的话，用点操做符就会报错，代码以下：  obj.for = “IT 公司面试手册”；由于 for是保留字，因此会报错 obj["for"] = “IT 公司面试手册”  就不会报错

 48 、 Javascript 面试题：如何建立一个  Javascript Object?  

能够有两种方式建立一个 Javascript Object, 代码以下： 

第一种方法： var obj = new Object();

 第二种方法：var ob = {}; 

49 、为何 Javascript 和  Java 有相似的名字？  

由于 Javascript语法是基于Java 语法的(松散的 ) 

50 、当一个用户浏览一个包含  Javascript 的页面，那个程序真正的执行了这些代码？   

用户机器的浏览器程序  

51 、“ 2names ”是一个合法的  Javascript 变量名吗？  

不是的  

52 、请写出一个 Javascript 数组的定义？  

var txt = new Array( ”tim” , “kim ”, “ jim”) 

53 、 <noscript> 有什么做用？

用来在客户端浏览器不支持 Javascript的时候显示标签内部的信息  

54 、哪一个事件是在表单元素失去焦点的时候触发？   

onblur 

55 、 Javascript 问题：有几种方法在你的  HTML 页面里面潜入一段 Javascript?  

方法有以下几种：  

<script src=”filename.js” type=”text/javascript”></script> 

<script src= ”filename.js”  type=”text/javascript ” charset=” utf-8″></script>

 也可使用DOM 来包含javascript文件：  

window.onload=function(){ 

if(!document.getElementById || !document.createElement){return;} 

var newjs=document.createElement(’script’); 

newjs.type=’text/javascript’; newjs.src=’myjsfile.js’; 

document.getElementsByTagName(’head’)[0].appendChild(newjs); 

} 

也能够动态经过 function添加一段javascript 到DOM: // loadscript(’ filepath/myjsfile.js’); 

function loadScript(src) { 

newjs= document.createElement( “script” ); 

newjs.src = src; 

newjs.type=’text/javascript’; 

head = document.getElementsByTagName( “head” )[0]; 

head.appendChild(newjs); 

} 

也可使用 javascript writeln()来进入一段javascript: 

document.write(”<scr ”+” ipt 

type=\”text/javascript\” 

src=\”yoursource.js\ ”></scr” +”ipt> ”);

 56 、如何用 JavaScript 启动  bat 文件   

<script   language=javascript> 

var   wsh   =   new   ActiveXObject(”WScript.Shell”);

wsh.Run(”C:/*****.bat”); 

</script>

57 、介绍一下 XMLHttpRequest 对象   

经过 XMLHttpRequest对象，Web 开发人员能够在页面加载之后进行页面的局部更新。  AJAX开始流行始于Google在 2005年使用的”Google Suggest ”。 

“Google Suggest”就是使用 XMLHttpRequest对象来建立动态的Web接口：  当用户开始输入google的搜索框， Javascript发送用户输入的字符到服务器，而后服务器返回一个建议列表。  

XMLHttpRequest对象在IE5.0+, Safari 1.2, Mozilla 1.0/Firefox, Opera 8+  和NetScapt7 开始被支持。  

58 、 AJAX 的全称是什么？    介绍一下 AJAX  

AJAX的全称是Asynchronous JavaScript And XML. 

AJAX是2005 年由Google发起并流行起来的编程方法，  AJAX不是一个新的编程语言，可是它是一个使用已有标准的新的编程技术。  

使用 AJAX能够建立更好，更快，更用户界面友好的 Web应用。 AJAX 技术基于 Javascript和HTTP Request. 

59 、介绍一下 isNaN 函数？  

若是参数不是数字类型的话 isNaN返回true

 60 、 javascript 都支持哪些布尔型的操做？   

&&, ||和！ 

61 、“ 1 ″  +2+4 在 javascript 中获得什么？   

由于“ 1”是String 类型，因此全部的操做数都是 String, 结果为124 

62 、 2+5+ ”  8 ″获得的结果是什么？  

由于 2和5 是数字类型， 8是字符串，因此获得的结果是 78 

63 、 javascript 有几种  loop 方法？  

for, while, do-while,  没有foreach 

64 、 javascript 如何建立一个新的对象？   

var obj = new Object()  或者 var obj = {} 

65 、如何为一个对象属性赋值？   

obj["age"]=17  或者obj.age=17 

66 、如何为一个数组添加一个值？

arr[arr.length]= value;

67 、 Javascript 的数据类型有几种？    

1. Number  数字类型  

2. String  字符串类型  

3. Boolean  布尔类型  

4. Function  函数 

5. Object  对象 

6. Null 

7. Undefined  没有定义类型  

68 、将字符串用指定字符分割成数组的函数是什么？   

<script type="text/javascript">

var str="How are you doing today?";

document.write(str.split(" ") + "<br />"); 

document.write(str.split("") + "<br />"); 

document.write(str.split(" ",3));

</script> 

69 、 Javascript 如何建立对象？   

答：建立对象的例子：

 personObj=new Object()

 personObj.firstname="John" 

personObj.lastname="Doe" 

personObj.age=50 

personObj.eyecolor="blue"

 70 、怎么取页面的 element 

document.getElementById( ”id” )或者 

form.elementName方法根据element  的name来取  

71 、怎么动态建立 element, 怎么设置他的鼠标事件  

var myLink = document.createElement('a'); 

var href = document.createAttribute('href'); 

myLink.setAttribute(href,'http://www.mianwww.com');

myLink.innerText ="Go here"; 

var spanAppend = document.getElementById('myDivLink'); 

spanAppend.appendChild(myLink);

72 、如何用 Javascript 判断上传文件的大小？    

有几种方法判断文件的大小：  

1. 用ActiveX 控件，代码以下：  

<script type= ”text/javascript” > 

function getFileSize(path) { 

var fileAO = new ActiveObject(”Scripting.FileSystemObject”); 

alert(”File size is:” + fileAO.GetFile(path).size); }

 </script> 

2. 能够利用img 标签的dynsrc属性来判断大小，  dynsrc属性是用来插入多媒体文件的，格式能够是 WAV,AVI, MP3等等，  例如<img dynsrc=” xxx.avi”>  这样就能够根据 Image对象的fileSize 属性来获得文件的大小，代码以下：

 <script type= ”text/javascript” >

 function getFileSize(filePath) { 

var image=new Image(); 

image.dynsrc=filePath; 

alert(image.fileSize); 

} 

</script> 

73 、 Prototype 如何实现页面局部定时刷新？    

可使用 Prototype的Ajax.PeriodicalUpdater 来实现页面的局部刷新。  好比  若是页面上须要定时刷新的  部分为<div id= ”refresh” ></div> 那么能够按照以下代码定时刷新这一部份  

new Ajax.PeriodicalUpdater(’refresh’, ‘/your_url’, { method: ‘get’, insertion: Insertion.Top, frequency: 1, decay: 2 }); 

其中的两个参数 frequency表示间隔的秒数，缺省状况下为 2。decay 表示若是返回的内容相同，则将 frequency的间隔时间加倍，这里第一次是 1秒，若是返回内容相同则编程两秒，而后四秒，而后八秒。。。若是每次返回的结果都不同  那么这个参数就不起做用

74 、 Prototype 如何更新局部页面？    

可使用 Ajax.Updater来更新局部页面，实例以下：  <div id=”company ”></div> 

以上是须要局部更新的容器，使用一下 javascript来操做 

new Ajax.Updater( ’company’ ,'/your_url’,{method: ’get’ }); 

75 、 Prototype 如何为一个  Ajax 添加一个参数？   

代码以下：  

new Ajax.Request(’/your_url’, { method: ‘get’, 

parameters: {name: ‘rainman’, limit: 12} }); 

76 、 Ajax 请求总共有多少种  Callback?  

Ajax请求总共有八种

Callback 

onSuccess 

 onFailure  

onUninitialized  

onLoading  

onLoaded  

onInteractive  

onComplete  

onException 

77 、 Prototype 中如何为一个元素添加一个方法？

Prototype提供的Element.addMethods() 方法能够  用来为一个元素添加自定义的方法，若是你有一个对象包含了一些自定义的方法，能够直接把这个对象传给 Element.addMethods(); 例如： 

var MyUtils = { 

truncate: function(element, length){ 

element = $(element); 

return element.update(element.innerHTML.truncate(length));

 }, 

updateAndMark: function(element, html){ 

return $(element).update(html).addClassName(’updated’);

  } 

} 

Element.addMethods(MyUtils); // now you can: 

$(’explanation’).truncate(100); 

须要注意的一点就是这些方法的第一个参数必须是这个元素自己，你还能够在方法的最后返回这个元素  

78 、 AJAX 都有哪些有点和缺点？    

传统的 web应用容许用户填写表单(form)，当提交表单时就向 web服务器发送一个请求。服务器接收并处理传来的表单，然後返回一个新的网页。这个作法浪费了许多带宽，由于在前後两个页面中的大部分 HTML代码每每是相同的。因为每次应用的交互都须要向服务器发送请求，应用的响应时间就依赖于服务器的响应时间。这致使了用户界面的响应比本地应用慢得多。  

与此不一样， AJAX应用能够仅向服务器发送并取回必需的数据，它使用 SOAP或其它一些基于 XML的 web service接口，并在客户端采用JavaScript处理来自服务器的响应。由于在服务器和浏览器之间交换的数据大量减小，结果咱们就能看到响应更快的应用。同时不少的处理工做能够在发出请求的客户端机器上完成，因此 Web服务器的处理时间也减小了。  

使用 Ajax的最大优势，就是能在不更新整个页面的前提下维护数据。这使得 Web应用程序更为迅捷地回应用户动做，并避免了在网络上发送那些没有改变过的信息。  Ajax不须要任何浏览器插件，但须要用户容许 JavaScript在浏览器上执行。就像 DHTML应用程序那样， Ajax应用程序必须在众多不一样的浏览器和平台上通过严格的测试。随着 Ajax的成熟，一些简化Ajax使用方法的程序库也相继问世。一样，也出现了另外一种辅助程序设计的技术，为那些不支持 JavaScript的用户提供替代功能。 

对应用 Ajax最主要的批评就是，它可能破坏浏览器后退按钮的正常行为 [4]。在动态更新页面的状况下，用户没法回到前一个页面状态，这是由于浏览器仅能记下历史记录中的静态页面。一个被完整读入的页面与一个已经被动态修改过的页面之间的差异很是微妙；用户一般都但愿单击后退按钮，就可以取消他们的前一次操做，可是在 Ajax应用程序中，却没法这样作。不过开发者已想出了种种办法来解决这个问题，当中大多数都是在用户单击后退按钮访问历史记录时，经过创建或使用一个隐藏的 IFRAME来重现页面上的变动。（例如，当用户在 Google Maps中单击后退时，它在一个隐藏的 IFRAME中进行搜索，而后将搜索结果反映到 Ajax元素上，以便将应用程序状态恢复到当时的状态。）  一个相关的观点认为，使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中。该问题的解决方案也已出现，大部分都使用 URL片段标识符（一般被称为锚点，即 URL中# 后面的部分）来保持跟踪，容许用户回到指定的某个应用程序状态。（许多浏览器容许 JavaScript动态更新锚点，这使得Ajax应用程序可以在更新显示内容的同时更新锚点。）这些解决方案也同时解决了许多关于不支持后退按钮的争论。  进行Ajax 开发时，网络延迟——即用户发出请求到服务器发出响应之间的间隔——须要慎重考虑。不给予用户明确的回应  [5]，没有恰当的预读数据 [6]，或者对 XMLHttpRequest的不恰当处理[7]，都会使用户感到延迟，这是用户不欲看到的，也是他们没法理解的 [8]。一般的解决方案是，使用一个可视化的组件来告诉用户系统正在进行后台操做而且正在读取数据和内容。  

一些手持设备（如手机、 PDA等）如今还不能很好的支持 Ajax; 

用JavaScript做的 Ajax引擎，JavaScript 的兼容性和 DeBug都是让人头痛的事; Ajax的无刷新重载，因为页面的变化没有刷新重载那么明显，因此容易给用户带来困扰――用户不太清楚如今的数据是新的仍是已经更新过的；现有的解决有：在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等 ; 对串流媒体的支持没有FLASH、 Java Applet好; 

79 、 Ajax 主要包含了哪些技术？    

Ajax（Asynchronous JavaScript + XML ）的定义  

基于 web标准（standards-based presentation ）XHTML+CSS的表示；  使用 DOM （Document Object Model）进行动态显示及交互；  使用 XML  和 XSLT 进行数据交换及相关操做；  使用 XMLHttpRequest  进行异步数据查询、检索；  

使用  JavaScript 将全部的东西绑定在一块儿。英文参见 Ajax的提出者Jesse James Garrett 的原文,原文题目 (Ajax: A New Approach to Web Applications) 。 相似于 DHTML或LAMP ，AJAX不是指一种单一的技术，而是有机地利用了一系列相关的技术。事实上，一些基于 AJAX的“派生/ 合成”式（ derivative/composite）的技术正在出现，如“ AFLAX”。 AJAX 的应用使用支持以上技术的 web浏览器做为运行平台。这些浏览器目前包括： Mozilla、Firefox 、Internet Explorer、 Opera、Konqueror 及Safari。可是 Opera不支持XSL 格式对象，也不支持 XSLT。

80 、 DOM 的优缺点都有什么？    

DOM的优点主要表如今：易用性强，使用 DOM时，将把全部的XML文档信息都存于内存中，而且遍历简单，支持 XPath，加强了易用性。 

DOM的缺点主要表如今：效率低，解析速度慢，内存占用量太高，对于大文件来讲几乎不可能使用。另外效率低还表如今大量的消耗时间，由于使用 DOM进行解析时，将为文档的每一个 element、attribute 、processing- instrUCtion和 comment都建立一个对象，这样在 DOM机制中所运用的大量对象的建立和销毁无疑会影响其效率。  

81 、谈谈 javascript 数组排序方法  sort() 的使用，重点介绍 sort() 参数的使用及其内部机制  

sort的实现的功能相似JAVA的比较器，数据排序从多维数组的第一维开始排序  能够本身定义排序方法，很很少的函数  

82 、简述 DIV 元素和  SPAN 元素的区别。  

DIV有回车，SPAN 没有 

83 、结合 <span   id= ” outer ” ><span   id= ” inner ” >text</span></span> 这段结构，谈谈

innerHTML   outerHTML   innerText  之间的区别。   

innerHTML对象里面的HTML,outerHTML 包括对象和里面的  innerText对象里面的文本 

84 、说几条 XHTML 规范的内容（至少  3 条）  

属性加引号，不能有不匹配的标签，加定义  

85 、对 Web 标准化（或网站重构）知道哪些相关的知识，简述几条你知道的  Web 标准？  

W3C标准等 

86 、如何用 Javascript 校验数字型  ?  

var re=/^\d{1,8}$|\.\d{1,2}$/;

 var str=document.form1.all(i).value; 

var r=str.match(re);

 if (r==null) { 

sign=-4; break; 

} else{

document.form1.all(i).value=parseFloat(str);

 }

87 、主要的 Ajax 框架都有什么？    

*  Dojo（dojotoolkit.org ）； 

* Prototype和Scriptaculous  （ www.prototypejs.org和script.aculo.us）；

 * Direct Web Reporting  （getahead.org/dwr）；  

* Yahoo! User Interface Library （developer.yahoo.com/yui）；

 * Google Web Toolkit  （code.google.com/webtoolkit）。  

*JQuery 

88 、 AJAX 的优缺点都有什么？    

一、最大的一点是页面无刷新，用户的体验很是好。  

二、使用异步方式与服务器通讯，具备更加迅速的响应能力。  

三、能够把之前一些服务器负担的工做转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。而且减轻服务器的负担， ajax的原则是“按需取数据”，能够最大程度的减小冗余请求，和响应对服务器形成的负担。

 四、基于标准化的并被普遍支持的技术，不须要下载插件或者小程序。  

ajax的缺点 

一、ajax 不支持浏览器 back按钮。 

二、安全问题 AJAX 暴露了与服务器交互的细节。

 三、对搜索引擎的支持比较弱。  

四、破坏了程序的异常机制。  

五、不容易调试。 

89 、 Ajax 的工做原理    

Ajax的核心是JavaScript 对象XmlHttpRequest。该对象在 Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之， XmlHttpRequest使您可使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。  

90 、谈一下 Javascript 中的对象    

JavaScript中的Object 是一组数据的 key-value的集合,  有点相似于 Java中的HashMap,  全部这些数据都是 Object里的property.  一般状况下 , JavaScript中创建一个对象用”new”加上 constructor function来实现.  如new Date(), new Object()等. 

var book = new Object();

book.name = “JavaScript is Cool”; 

book.author = “tom”; 

book.pages = 514; 

上面例子中的 name和page 就是名为 book的对象中的property.  咱们能够用 delete来删除Object 中的property: “ delete book.name;”.  除了Object, Date等 buildin的对象外,  咱们能够写本身的 constructor function, 而后使用new 就能够创建本身的对象 . 如上面的book 能够写成 : 

function Book (name, author, page) {

 this.name = name; 

this.author = author; 

this.page = page; 

} 

var abook = new Book(”JavaScript is Cool”, “tom”, 514);

91 、 Javascript 脚本必须写在什么标签以内。   

<script> 

92 、 javascript  的优缺点和内置对象    

1）优势：简单易用，与Java 有相似的语法，可使用任何文本编辑工具编  写，只须要浏览器就可执行程序，而且事先不用编译，逐行执行，无需进行严格  的变量声明，并且内置大量现成对象，编写少许程序能够完成目标；  

2）缺点：不适合开发大型应用程序；  

3）Javascript  有11 种内置对象：  

Array、String 、Date、 Math、Boolean 、Number、 Function、Global 、Error、 RegExp、Object 。

93 、   介绍一下  XMLHttpRequest 对象的经常使用方法和属性    

open(“method ”,” URL”)  创建对服务器的调用，第一个参数是 HTTP请求     方式能够为 GET，POST 或任何服务器所支持的您想调用的方式。  第二个参数是请求页面的 URL。 

send()方法，发送具体请求 abort()方法，中止当前请求  

readyState属性    请求的状态  有5 个可取值  

0=未初始化  ，1=正在加载， 2=以加载，3= 交互中， 4=完成 

responseText 属性   服务器的响应，表示为一个串  

reponseXML 属性  服务器的响应，表示为 XML 

status     服务器的 HTTP状态码，200 对应ok  400对应 not found 

94 、  XMLHttpRequest 对象在  IE 和 Firefox 中建立方式有没有不一样？    

有， IE中经过new ActiveXObject() 获得，Firefox中经过 new XMLHttpRequest()获得 

95 、   在   Ajax 应用中信息是如何在浏览器和服务器之间传递的    

Ajax与服务端是经过字符串或者 xml进行交互的 

96 、  Ajax 和  javascript 的区别？

javascript是一种在浏览器端执行的脚本语言， Ajax是一种建立交互式网页应用的开发技术  ，它是利用了一系列相关的技术其中就包括 javascript。 Javascript 是由网景公司开发的一种脚本语言，它和 sun公司的java 语言是没有任何关系的，它们类似的名称只是一种行销策略。  

在通常的 web开发中，javascript 是在浏览器端执行的，咱们能够用 javascript控制浏览器的行为和内容。

  

 

 

 

 

注：本文来自互联网，若有侵权请联系删除