web前端百度面试准备备.docx

JavaScript中如何检测一个变量是一个String类型？

请写出函数实现

String类型有两种生成方式：

（1）Varstr=“helloworld”;

（2）Varstr2=newString（“helloworld”）;

functionIsString（str）{

return（typeofstr=="string"||str.constructor==String）;

}

网页中实现一个计算当年还剩多少时间的倒数计时程序，要求网页上实时动态显示“××年还剩××天××时××分××秒”

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose.dtd">

functioncounter（）{

vardate=newDate（）;

varyear=date.getFullYear（）;

vardate2=newDate（year,12,31,23,59,59）;

vartime=（date2-date）/1000;

varday=Math.floor（time/（24*60*60））

varhour=Math.floor（time%（24*60*60）/（60*60））

varminute=Math.floor（time%（24*60*60）%（60*60）/60）;

varsecond=Math.floor（time%（24*60*60）%（60*60）%60）;

varstr=year+"年还剩"+day+"天"+hour+"时"+minute+"分"+second+"秒";

document.getElementById（"input"）.value=str;

}

window.setInterval（"counter（）",1000）;

JavaScript有哪几种数据类型

简单：

Number，Boolean，String，Null，Undefined

复合：

Object，Array，Function

JavaScript中如何对一个对象进行深度clone

functioncloneObject（o）{

if（!

o||'object'!

==typeofo）{

returno;

}

varc='function'===typeofo.pop?

[]:

{};

varp,v;

for（pino）{

if（o.hasOwnProperty（p））{

v=o[p];

if（v&&'object'===typeofv）{

c[p]=Ext.ux.clone（v）;

}

else{

c[p]=v;

}

}

}

returnc;

};

请给出异步加载js方案，不少于两种

默认情况javascript是同步加载的，也就是javascript的加载时阻塞的，后面的元素要等待javascript加载完毕后才能进行再加载，对于一些意义不是很大的javascript，如果放在页头会导致加载很慢的话，是会严重影响用户体验的。

异步加载方式：

（1）defer，只支持IE

（2）async：

（3）创建script，插入到DOM中，加载完毕后callBack，见代码：

请设计一套方案，用于确保页面中JS加载完全。

varn=document.createElement（"script"）;

n.type="text/javascript";

//以上省略部分代码

//ie支持script的readystatechange属性（IEsupportthereadystatechangeeventforscriptandcssnodes）

if（ua.ie）{

n.onreadystatechange=function（）{

varrs=this.readyState;

if（'loaded'===rs||'complete'===rs）{

n.onreadystatechange=null;

f（id,url）;//回调函数

}

};

//省略部分代码

//safari3.xsupportstheloadeventforscriptnodes（DOM2）

n.addEventListener（'load',function（）{

f（id,url）;

}）;

//firefoxandoperasupportonload（butnotdom2inff）handlersfor

//scriptnodes.opera,butnoff,supporttheonloadeventforlink

//nodes.

}else{

n.onload=function（）{

f（id,url）;

};

}

js的基础对象有那些,window和document的常用的方法和属性列出来

String,Number,Boolean

Window:

方法：

setInterval,setTimeout,clearInterval,clearTimeout,alert,confirm,open

属性：

name,parent,screenLeft,screenTop,self,top,status

Document

方法：

createElement,execCommand,getElementById,getElementsByName,getElementByTagName,write,writeln

前端开发的优化问题

（1）减少http请求次数：

cssspirit,datauri

（2）JS，CSS源码压缩

（3）前端模板JS+数据，减少由于HTML标签导致的带宽浪费，前端用变量保存AJAX请求结果，每次操作本地变量，不用请求，减少请求次数

（4）用innerHTML代替DOM操作，减少DOM操作次数，优化javascript性能

（5）用setTimeout来避免页面失去响应

（6）用hash-table来优化查找

（7）当需要设置的样式很多时设置className而不是直接操作style

（8）少用全局变量

（9）缓存DOM节点查找的结果

（10）避免使用CSSExpression

（11）图片预载

（12）避免在页面的主体布局中使用table，table要等其中的内容完全下载之后才会显示出来，显示比div+css布局慢

（13）启用GZIP压缩

（14）保持良好的编程习惯，避免重复的CSS，JavaScript代码，多余的HTML标签和属性

Flash、Ajax各自的优缺点，在使用中如何取舍？

Ajax的优势

（1）可搜索型

（2）开放性

（3）费用

（4）易用性

（5）易于开发

Flash的优势

（1）多媒体处理

（2）兼容性

（3）矢量图形比SVG，Canvas优势大很多

（4）客户端资源调度，比如麦克风，摄像头

JS中调用某个函数之前，如何取得该函数最多可以传递多少个参数？

该函数被调用时，如果知道传了多少个参数过来？

假设函数名为fun，那个fun.length就是它最多能接受的参数个数；

在fun函数里面，arguments就是用数组装着调用时传过来的所有参数，因此arguments.length就是已经传递过来的参数个数；

编写一个方法去掉一个数组的重复元素

Array.prototype.strip=function（）

{

if（this.length<2）return[this[0]]||[];

vararr=[];

for（vari=0;i

{

arr.push（this.splice（i–,1））;

for（varj=0;j

{

if（this[j]==arr[arr.length-1]）

{

this.splice（j–,1）;

}

}

}

returnarr;

}

vararr=["abc",85,"abc",85,8,8,1,2,5,4,7,8];

alert（arr.strip（））;

用脚本写去除字符串的前后空格

String.prototype.trim=function（mode）

{//前后去空格

if（mode==’left’）{

return（（this.charAt（0）==“”&&this.length>0）?

this.slice

（1）.trim（‘left’）:

this）;

}else

if（mode==‘right’）{

return（（this.charAt（this.length-1）==“”&&this.length>0）?

this.slice（0,this.length-1）.trim（‘right’）:

this）;

}else{

returnthis.trim（‘left’）.trim（‘right’）;

}

};

介绍一下Session及Session与Cookie的区别

Session是相当于Server端的Cookie,Cookie是在客户端保存数据，Session是在Server端保存数据。

Session状态是保存在Server端的文件或者数据库中，每个Session是由SessionId来识别，为了使客户端能够识别它自己，SessionID必须有Server端来创建然后发送到客户端，当客户端向Server端发送请求时，也需要发送SessionID.

如果Cookie没有用来保存SessionID,那么Session会在浏览器关闭的时候失效，或者用户通过连接到其他URL来打断POST或者querystring传递，也就是说，session在用户离开这个站点的时候就会失效。

js对象的深度克隆？

20分

Object.prototype.deepClone=function（）{

  function cloneObj（）{}  

   cloneObj.prototype=this;

   var obj=new cloneObj（）;

   for（var o in obj）{

     if（typeof（obj[o]）=="object"）obj[o]=obj[o].deepClone（）;

     }   return obj;

}

动态打印时间，格式为yyyy-MM-ddhh:

mm:

ss?

15分

1.function printTime（）{

1.   var timer1=new Date（）;

1.   var timer=timer1.toLocaleString（）;

2.   timer=timer.replace（/[年月]/g,"-"）;

3.   timer=timer.replace（/日/,""）;

1.   time.innerHTML=timer;

2.}setInterval（"printTime（）",1000）;

CSS引入的方式有哪些?

link和@import的区别是?

1）link方法

2）使用@import引入

3）页面直接加样式

差别1：

link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义RSS，定义rel连接属性等，@import就只能加载CSS了。

差别2：

加载顺序的差别。

当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载。

而@import引用的CSS会等到页面全部被下载完再被加载。

差别3：

兼容性的差别。

由于@import是CSS2.1提出的所以老的浏览器不支持，@import只有在IE5以上的才能识别，而link标签无此问题。

差别4：

使用dom控制样式时的差别。

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

如何居中一个浮动元素?

设置容器的浮动方式为相对定位然后确定容器的宽高比如宽500高300的层然后设置层的外边距

.Div{Width:

500px;height:

300px;Margin:

-150px00-250px;position:

absolute;left:

50%;top:

50%;}

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

涉及到人手、分工、同步；

先期团队必须确定好全局样式（globe.css），编码模式（utf-8）等

编写习惯必须一致（例如都是采用继承式的写法，单样式都写成一行）；

标注样式编写人，各模块都及时标注（标注关键样式调用的地方）；

页面进行标注（例如页面模块开始和结束）；

CSS跟HTML分文件夹并行存放，命名都得统一（例如style.css）

JS分文件夹存放命民以该JS功能为准英文翻译；

图片采用整合的images.pngpng8格式文件使用尽量整合在一起使用方便将来的管理

以空格字符串作为分隔字符串，将如下字符串拆分成数组（每个元素不能含有空格字符）

varstr='abc20defg123';

//答案

str.split（/\s+/）;

编写代码让f1继承f2的所有成员

functionf1（）{

this.a1=1;

this.b1=2;

}

functionf2（）{

this.a2=3;

this.b2=4;

}

f1.prototype=newf2（）;

f1.prototype.constructor=f1;

把16进制颜色转变成rgb颜色，如:

#FFFFFF等同rgb（255,255,255）

functionexChange（color）{

return'rgb（'+parseInt（color.substr（1,2）,16）+','+parseInt（color.substr（3,2）,16）+','+parseInt（color.substr（5,2）,16）+'）';

}

img的alt和title的异同？

10分

答：

title属性为设置该属性的元素提供建议性的信息。

比如为链接添加描述性文字。

为不能显示图像、窗体或applets的用户代理（UA），alt属性用来指定替换文字。

使用alt属性是为了给那些不能看到你文档中图像的浏览者提供文字说明。

行内元素有哪些？

块级元素有哪些？

行内元素有：

abspanIbemimginputselectstrong

块级元素有：

divulollidldtddh1h2h3h4…p

html与xhtml的区别规范是什么

1、XHTML元素必须被正确地嵌套。

例子：

一般html网页可以“主要内容”这是个不严格，在XHTML是错误的；正确的在xhtml标准中就必须要求这样“主要内容”。

2、XHTML元素必须被关闭。

exp：

1、一个HEAD里的例子，“