WEB笔试题

1.分别写出10个行内标签和5个块级标签(h系列算一个标签)

行内标签： <a>标签可定义锚</a>， <b>字体加粗</b>， <em>定义为强调的内容</em>， <i>斜体文本效果</i>， <sup>上标/sup> _下标， <u>下划线</u><ins></ins>， <del>删除线/del><s></s>, <strong>加粗</strong><b></b>, <lable></lable>

块级标签 h1~h6标签， <p>段落</p>， <ul>无序列表</ul>， <ol>有序列表</ol>， <li>有序列表</li>， <div><div> <form>表单</form>, <table>表格</table>

2.请写出CSS中几种浏览器的前缀写法

-moz- 火狐等使用Mozilla浏览器引擎的浏览器 ; -webkit- Safari, 谷歌浏览器等使用Webkit引擎的浏览器; -o- Opera浏览器(早期); -ms- Internet Explorer (IE);

3.请写出5个CSS中有兼容问题的属性名称

background-size: 调整背景图片的大小，最低兼容至IE9; word-wrap；text-overflow；text-shadow； transition：过渡； transform：转换； Animation：动画； border-radius：圆角； box-shadow：阴影； border-image：边框图片； column-count: 规定元素应该被分隔的列数。 column-gap: 规定列之间的间隔。 column-rule: 设置列之间的宽度、样式和颜色规则

4.请写出JS创建对象的四种方式

一，字面量创建

var obj={ 键1:值1, 键2:值2, 方法名1:function(){}, 方法名2:function(){} }

二，new 对象创建 new Object();O大写

var obj=new Object(); //创建一个空白对象 // console.log(obj); obj.name="小白"; obj.age=12; obj.show=function () { console.log("秀儿同学"); } obj.walk=function () { console.log("走猫步"); }

三，工厂函数造对象

//工厂函数造对象 function createNewObj(name,age){ var obj=new Object(); obj.name=name; obj.age=age; obj.show=function () { console.log("请不要秀"); } obj.walk=function () { console.log("朕要巡视了..."); } return obj; } var newObj=createNewObj("小白",12); console.log(newObj); var newObj1=createNewObj("(●—●)",16); console.log(newObj1); // 批量造对象 for(var i=0;i<10;i++){ var per=createNewObj("哈哈"+i,i+10) console.log(per); }

四，构造函数创建对象

//创建一个构造函数 function Person(name,age){ this.name=name; this.age=age; this.show=function () { console.log("构造函数对象的show"); } this.walk=function () { console.log("构造函数的走路方法"); } } // 根据构造函数创建对象 var per=new Person("小白",12); console.log(per); var per1=new Person("小红",18); console.log(per1);

5.写出五种JS中的兼容问题,以及解决方式(节点访问里面那些算一种)

1.事件对象的获取兼容

onclick=function(event){ event = event || window.event; }

2.阻止默认事件的兼容

function prevent(event){ event = event || window.event; if(event.preventDefault){ event.preventDefault(); }else { event.returnValue = false; } }

3.鼠标到body的距离

function getpageXY（event）{ return{ x：scroll().left+event.clientX, y: scroll().top+event.clientY } }

4.事件冒泡阻止

function stopBubble(event){ if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble=true; } }

5.页面被卷去头部和左侧的距离兼容性封装

function scroll() { if (window.pageXOffset!=undefined){ return{ left:window.pageXOffset, top:window.pageYOffset } } else{ return{ left:document.documentElement.scrollLeft, top:document.documentElement.scrollTop } } }

6.写出冒泡排序(要求:四次优化不能少)

var arr=[8,1,5,3,7]; console.log("操作前原数组：",arr); for(var j=0;j<arr.length-1;j++){ var boo=true; for(var i=0;i<arr.length-1-j;i++){ if(arr[i+1]){ boo=false; var temp=arr[i]; arr[i]=arr[i+1]; arr[i+1]=temp; } console.log("第"+j+"轮"+"第"+i+"次"); } console.log("本次交换完数组：",arr); if(boo){ //如果本轮完事，没有执行if语句，表示前面没有比后面小的，也就是前面比后面大，那么就是有顺序的了，可停止循环。 break; } } console.log("操作后的原数组",arr);

冒泡排序法四次优化 1内层for循环：变量<.length-1; 原因：最后一个数，不能和后面比较，所以最大索引是倒数第二个索引。 2外层for循环：变量<.length-1; 原因：n个数，冒泡（n-1）次就会出现顺序。 3内层for循环：变量<.length-1-外层for循环变量； 原因：每轮冒泡结束后，就会诞生一个最下值，下一轮可少比较一次。 4开闭原则：排出顺序立即停止。

7.请写出将当前日期以YYYY-MM-DD HH:mm:ss打印的代码

例如:今天是2019年1月15日 15点18分25秒 则最后在控制台输出:2019-01-15 15:18:25

var h1=document.getElementsByTagName("h1")[0]; var date; setDate(); function setDate() { date=new Date(); var year=date.getFullYear(); var month=date.getMonth(); var day=date.getDate(); var week=date.getDay(); var hour=date.getHours(); var minute=date.getMinutes(); var second=date.getSeconds(); var arr=["日","一","二","三","四","五","六"]; var str=year+"年"+month+"月"+day+"日 星期"+arr[week]+" "+hour+"小时"+minute+"分钟"+second+"秒"; h1.innerHTML=str; }

8.手写数组去重的方法

//编写一个方法 去掉一个数组的重复元素 var arr= ["c","a","c","z","d","a","x","a","x","a"]; var newArr=[]; arr.forEach(function (item,index,arr) { //利用indexOf方法 该方法就是找到元素第一次出现的位置 //如果跟当前元素的位置不一样 那么就证明当前元素不是第一次出现了 if(arr.indexOf(item)==index){ newArr.push(item); } }) // console.log(arr.indexOf("c")); console.log(newArr);```