web前端常见笔试题总结

一、常见javascript笔试题

1.  var a = 1;

    delete a;

    console.log( typeof a); //number

   显示生命的全局变量不能被删除 如果是

   a = 1;   delete a;

   console.log(typeof a) //undefined;

  隐式声明的全局变量可以删除

2.用一行代码实现字符串翻转 如： str="abcdefg",翻转后str="gfedcba";

  var a = str.split('').reverse().join('');//gfedcba

3.  var a = 1 ;

  var b= 2;

  var abc = function(){

    var a=b=3;

   }

  abc();

 console.log(a,b);  //1 3

这题一看觉得很简单，但是个陷阱 var a=b=3;等价于var a=(b=3);b是全局变量

 

4.编写一个方法求一个字符串的字节长度（英文占一个字节，中文占两个字节）。

function GetBytes(str){

    var len = str.length;

 var bytes = len;

 for(var i=0;i<len;i++){

    if(str.charCodeAt(i) > 255) bytes++;

 }

 return bytes;

}

5.计算当年还剩多少时间，动态显示“xx年还剩xx天xx时xx分xx秒”

function getLastTime(){

   var date = new Date();

   var d = date.getTime();

   var year = date.getFullYear();

   var endDate = new Date(year,12,31,23,59,59);

   var time = Math.floor((endDate.getTime() - date.getTime())/1000);

   var day = Math.floor(time/(24*60*60));

   var hour = Math.floor(time%(24*60*60)/(60*60));

   var minute = Math.floor(time%(24*60*60)%(60*60)/60);

   var second = Math.floor(time%(24*60*60)%(60*60)%60);

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

   document.getElementById("btn").value = str;

}

setInterval(getLastTime,1000);

//这题在几次笔试中已出过3次

6.   

  setTimeout(function(){console.log("c")},3000);

   setTimeout(function(){ while(1){}},2000);

   setTimeout(function(){console.log("b")},1000);

   console.log("a");

  //输出 a b

二、css常见笔试题

1.盒子模型

注意IE6-8的盒子模型与其他浏览器的区别，这里就不细说了。

 

2.IE6的双倍边距问题

浮动元素在ie6下产生双倍边距，定义浮动元素display：inline；

3.什么是css hack，常见的有哪些？

css hack指各版本及各品牌浏览器之间对CSS解释后出现网页内容的兼容bug误差(比如我们常说错位)的处理。

IE6   _height;

IE7  *+height

IE6,IE7  *height

IE7,FF   height !important;

4.为什么不能定义高度为 1px 的容器？

百度：IE6默认高度造成，解决方法

例如：overflow:hidden | zoom:0.08 | line-height:1px

5.两列布局，左边固定200px宽度，右边自适应

 <div>

     <div class="adide"></div>

     <div class="content"></div>

  </div>

.adide { width:200px; background:#000000; position:absolute; height:500px;}

.content{ margin-left:200px; background:#BB9798; height:500px;}

6.超链接的先后顺序

a:link

a:visited

a:hover

a:active

 

三。综合题（口水题）

这类题目纯属口水提，不要留空白

1.请列出你说知道的ie6bug？

超链接要有href属性hover才生效、双倍边距、背景图片闪烁、定义100%高度...

 

2.你对HTML5与CSS3的了解？有哪些属性

css3:多背景、box-shadow、text-shdaow、transform、transition、多列、以及新增的选择器

html5: audio、video、html5离线存储功能、web存储 localstorage、sessionstorage

、web sql、 canvas、 强大的表单功能、geolocation地理定位。

 

3.网站性能优化方法？

请参考Yahoo团队：网站性能优化的35条黄金守则

 

4.w3c标准是什么？

网页主要由三部分组成：结构\表现\和行为.对应的标准也分三方面：结构化标准语言主要包括 XHTML和XML；表现标准语言主要包括CSS；行为标准主要包括对象模型（如W3C DOM）、ECMAScript等。