1、使用Javascript打印出1-10000之间的所有对称数（例如 121 1331等）【掌握】 代码：
function print(start,end) { if (start>end) { return []; } var res=[]; for(var i=start;i<end;i++){ var len=i.toString().length; if (i.toString()===i.toString().split('').reverse().join('')&&len>1) { res.push(i); } } return res; }
2、写一个traverse函数，输出所有页面宽度和高度大于50像素的节点。【掌握】
function traverse(){ var arr=[...document.querySelector('body *')]; return arr.filter(function(node){ return node.offsetWidth>50&&node.offsetHeight>50; }); }
3、js对象的深度克隆代码实现【掌握】
function deepClone(obj){ var newObj=obj instanceof Array?[]:{}; for (var attr in obj) { if (obj.hasOwnProperty(attr)) {//防止复制原型链上的属性 newObj[attr]=typeof obj[attr]=='object'?deepClone(obj[attr]):obj[attr]; } } return newObj; }
4、编写一个JavaScript函数，实时显示当前时间，格式“年-月-日 时:分:秒”。【掌握】 代码：
(function curTime(){ setInterval(function(){ let time=new Date(); let [year,month,day,hour,minute,second]=[time.getFullYear(),time.getMonth()+1,time.getDate(),time.getHours(),time.getMinutes(),time.getSeconds()]; var cur=year+'-'+month+'-'+day+' '+hour+':'+minute+":"+second; console.log(cur); },1000); })();
5、js操作和获取cookie【掌握】 代码：
function setCookie(name,value,expires,path,domain,secure) { var cookieText=encodeURIComponent(name)+'='+encodeURIComponent(value); if (expires instanceof Date) { cookieText+=';expires='+expires; } if (path) { cookieText+=';path='+path; } if (domain) { cookieText+=';domain='+domain; } if (secure) { cookieText+=';secure'; } document.cookie=cookieText; } // 获取cookie function getCookie(name) { var cookieName=encodeURIComponent(name)+'='; var cookieStart=document.cookie.indexOf(cookieName); var cookieValue=null; if (cookieStart>-1) { var cookieEnd=document.cookie.indexOf(';',cookieStart); if (cookieEnd==-1) { cookieEnd=document.cookie.length; } cookieValue=decodeURIComponent(document.cookie.substring(cookieStart+cookieName.length,cookieEnd)); } return cookieValue; } // 删除cookie function unsetCookie(name) { document.cookie=name+'=;expires='+new Date(0); }
6、写一个通用的事件监听器函数【掌握】 代码：
obj.eventFunc={ addEvent(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false); }else if(element.attachEvent){ element[type+handler]=function(e){ handler.call(element,window.event); }; //不用匿名函数是为了便于移除事件 element.attachEvent("on"+type, element[type+handler]); } }, removeEvent(element,type,handler){ if(element.removeEventListener){ element.removeEventListener(type,handler,false); }else if(element.detachEvent){ element.detachEvent("on"+type,element[type+handler]); element[type+handler]=null; } }, getEvent(e){ return e||window.event; }, getTarget(e){ e=this.getEvent(e); var target=e.target||e.srcElement; if(target.nodeType==3){//如果是Safari下的文本节点 target = target.parentNode; } return target; }, getCharCode(e){ e=this.getEvent(e); if(typeof e.charCode=="number"){ return e.charCode; }else{ return e.keyCode; } }, preventDefault(e){ e=this.getEvent(e); if(e.preventDefault){ e.preventDefault(); }else{ e.returnValue = false; } }, stopPropagation(e){ e=this.getEvent(e); if(e.stopPropagation){ e.stopPropagation(); }else{ e.cancelBubble = true; } }, }
7、用javascript实现用户登录验证的代码。【掌握】
//检查对象checkObject var checkObject=function(){ var tipP=document.createElement("p"); tipP.appendChild(document.createTextNode("密码错误")); var tipU=document.createElement("p"); tipU.appendChild(document.createTextNode("用户名错误")); function addErrorTip(node,type){ node.className='error'; if(type=='username'){ node.parentNode.appendChild(tipU); }else if(type == 'password'){ node.parentNode.appendChild(tipP); } } function removeErrorTip(node,type){ node.className=''; if(type==='username'){ node.parentNode.removeChild(tipU); }else if(type==='password'){ node.parentNode.removeChild(tipP); } } function isValidName(name){ if(name){ return true; }else{ return false; } } function isValidPassword(password){ var lenIsEnough=password.length>6; //密码长度大于6 var hasDigital=/{\d}+/.test(password); //密码包含数字 var hasCharater=/{\w}+/.test(password); //密码包含其它字符 return lenIsEnough&&hasDigital&&hasCharater; } return { addErrorTip:addErrorTip, removeErrorTip:removeErrorTip, isValidName:isValidName, isValidPassword:isValidPassword }; }; //创建一个检查对象的实例checkObj var checkObj=checkObject(); var form=document.forms['login-form']; var username=form['username']; //name是关键字 var password=form['password']; form.addEventListener('submit',function(e){ if(!checkObj.isValidName(username.value)) { checkObj.addErrorTip(username,'username'); e.preventDefault(); } if(!checkObj.isValidPassword(password.value)) { checkObj.addErrorTip(password,'password'); e.preventDefault(); } }, false); form.addEventListener('reset',function(){ checkObj.removeErrorTip(username,'username'); checkObj.removeErrorTip(password,'password'); },false); username.addEventListener('blur',function() { if (!checkObj.isValidName(username.value)) { checkObj.addErrorTip(username,'username'); } }, false); username.addEventListener('focus',function() { checkObj.removeErrorTip(username,'username'); }, false); password.addEventListener('blur',function() { if (!checkObj.isValidPassword(password.value)) { checkObj.addErrorTip(password,'password'); } }, false); password.addEventListener('focus',function(event) { checkObj.removeErrorTip(password,'password'); }, false);
8、我们在进行组件开发的时候，经常会需要用到大量颜色。有两种方法。方法1：预先定义好大量的颜色；方法2：自定义函数，采用随机生成颜色的方式。请采用方法2实现随机颜色汲取。 代码：
function getColor(){ var hex=(Math.random()*0xffffff).toString(16); return '#'+hex.split('.')[0]; }
9、编写一个JavaScript函数，输入指定类型的选择器 (仅需支持id，class，tagName三种简单CSS选择器，无需兼容组合选择器) 可以返回匹配的DOM节点数组，需考虑浏览器兼容性和性能。
var query = function(selector){ var str=selector.match(/^(\.|#)?(\w+)$/); var res=[]; if (str) { switch(str[1]) { case '.': res=[...document.getElementsByClassName(str[2])]; break; case '#': res.push(document.getElementById(str[2])); break; default: res=[...document.getElementsByTagName(str[2])]; } } return res; }
