总结的一些前端开发笔试题
最近正忙于前端的应聘，在网络上搜集了一些问题，顺便结合网络答案，自己也整理了一部分，如有纰漏，还望批评指正。
1、请写出至少三个CSS3中新添加的样式属性的名字；
（1）增强的文本属性：text-shadow（CSS2.1中已定义，但CSS3中又重新定义并增加了不透明度效果）、text-overflow、word-wrap;
（2）新增的盒模型属性：box-align、box-direction、box-flex、box-flex-group、box-lines、box-orient、box-pack;
（3）border-top-color/border-right-color/border-bottom-color/border-left-color/border-image/border-radius
（4）overflow-x/overflow-y/box-sizing/resize/nav-index/transform等等
ps:由于一开始就学的CSS3，所以对于那些是CSS3中那些是新添加的，有点模糊。自己看了下，就不一一列举了。
2、JavaScript包括哪些数据类型？
第一种：javascript中包含6种数据类型：undefined、null、string、number、boolean和object。其中，前5 种是原始数据类型，object是对象类型。
object类型中包括Object、Function、String、Number、Boolean、Array、Regexp、Date、 Globel、Math、Error，以及宿主环境提供的object类型。
第二种：九种类型：1、未定义undefined 2、空null 3、布尔boolean 4、字符串string 5、数字number 6、对象object 7、引用reference 8、列表list 9、完成completion 后三种类型是javascript运行时的中间结果的数据类型，在代码中不能使用。
3、使用JavaScript深度克隆一个对象？
深度克隆：所有元素或属性均完全克隆，并于原引用类型完全独立，即，在后面修改对象的属性的时候，原对象不会被修改。
1 Object.prototype.Clone=function(){ 2 var objClone; 3 if(this.constructor==Object){ 4 objClone=new this.constructor(); 5 } 6 else{ 7 objClone=new this.constructor(this.valueOf()); 8 } 9 for(var key in Object){ 10 if(objClone[key]!=this[key]){ 11 if(typeof(this[key])=="object"){ 12 objClone[key]=this[key].Clnoe(); 13 } 14 else{ 15 objClone[key]=this[key]; 16 } 17 } 18 } 19 objClone.toString=this.toString; 20 objClone.valueOf=this.valueOf; 21 }
4、用javascript实现控制一个文本框的输入字数限制，超出字数限制文本框飘红显示。
<script type="text/javascript">
function checkLength(Id){
var maxValue=9;//设定最大的文本字数
if(Id.value.length>9){
Id.style.borderColor="red";
//alert("已超出文本的长度！");
}
}
</script>
<form>
<input id="ss" type="text" onkeyup="checkLength(this)">
</form>
5、HTML5强调标签的语义化，请写出5个HTML5的语义化标签。
<header><nav><article><aside><footer><section><hgroup><address><time><figure>.......
6、使用javascript实现，将文档中className有“test”的td标签背景色设为黄色.
var tds=document.getElementsByTagName("td"); for(var i=0;i<tds.length;i++){ if(tds[i].className.indexOf("test")!=-1){ tds[i].style.backgroundColor="yellow"; } }
7、数组去重。
var arr=[15,29,33,33,15,23,19,29,56];//需要去重的数组 var newArr=[]; var json={}; for(var i=0;i<arr.length;i++){ if(!json[arr[i]]){ newArr.push(arr[i]); json[arr[i]]=1; } } alert(newArr);
8、统计一个字符串中，出现次数最多的字符，统计这个字符出现的次数。
1 var ss="abcdefgabaag"; 2 for(var i=0,len=0,temp="";i<ss.length;i++){ 3 var s=ss.substr(i,1); 4 var tt=ss.split(s); 5 if((tt.length-1)>len){ 6 len=tt.length-1; 7 temp=s+"出现最多次数为"+len; 8 } 9 } 10 alert(temp);
9、在网页上实现当年还剩多少时间，格式:xx年还剩xx天xx小时xx分xx秒。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 7 </head> 8 <body> 9 <div id="datatime"></div> 10 <script type="text/javascript"> 11 function counter() { 12 document.getElementById("datatime").innerHTML=""; 13 var date = new Date(); 14 var year = date.getFullYear(); 15 var date2 = new Date(year, 12, 31, 23, 59, 59); 16 var time = (date2 - date)/1000; 17 var day =Math.floor(time/(24*60*60)) 18 var hour = Math.floor(time%(24*60*60)/(60*60)) 19 var minute = Math.floor(time%(24*60*60)%(60*60)/60); 20 var second = Math.floor(time%(24*60*60)%(60*60)%60); 21 var str = year + "年还剩"+day+"天"+hour+"时"+minute+"分"+second+"秒"; 22 document.getElementById("datatime").innerHTML=str; 23 24 } 25 window.setInterval("counter()", 1000); 26 </script> 27 </body> 28 </html>