复习整理html1.html5有哪些新特性?新增语义标签、等。新增元素用于绘画。用于媒体播放的视频和音频元素。本地缓存有更好的支持(localStorage和sessionStorage)2.什么是html,什么是html文档?HTML是一种用于描述网页的超文本标记语言。HTML文档也叫网页,包含HTML标签和纯文本3.什么是?它不是html标签,它为浏览器提供信息声明,告诉浏览器html写在什么版本,用来表示html版本4。html文档的类型有html,html+,html2.0,html3.2、html4.01、xhtml1.0、html5等css1。简单介绍一下flexlayoutflexlayout:灵活布局,在设置相同间距的布局,单行单列布局,display可以设置为flex或inline-flex时使用起来相当方便。当设置display:flex时,子元素的float、clear、vertical-align属性都会失效。容器属性:flex-direction设置主轴的排列方向,包括row(垂直向下排列)、row-reverse(垂直向上排列)、column(垂直向右排列)、column-reverse(垂直向左排列))flex-wrap设置是否排列在一条线上,有nowrap、wrap和warp-reverse三个选项flex-flow是flex-direction的简写,flex-wrapjustify-content用flex定义了item在主轴上的对齐方式-开始|弹性端|中心|间隔|space-aroundalign-items定义横轴的对齐方式flex-start|弹性端|中心|基线|改变item的对齐方式)order(项目排列顺序)flex-grow(项目放大比例)flex-shrink(项目缩小比例)flex-basis(分配多余空间时项目占用的主轴空间)flex(flex-grow,flex-shrink,flex-basis的缩写)2.简述grid布局Grid布局3.实现水平和垂直居中的几种方法使用display:flex,justify-content:center,align-item:center来确定高度和宽度如果.test{position:absolute;margin:auto;left:0;top:0;right:0;bottom:0;}或.test{position:absolute;margin:auto;left:50%;顶部:50%;上边距:-height/50;左边距:-宽度/50;},不确定height-width.test{position:absolute;保证金:自动;左:50%;顶部:50%;transform:translate(-50%,-50%)},4.常见的块级元素和行内元素块级元素:div,form,table,p,h1-h6,dl,li,ul,ol等行内元素:a.strong,br,img,i,span,label,input,textarea,select等5.position定位有哪些?absolute(绝对定位,相对于第一个值为非static的父元素定位)relative(相对定位,相对于其正常位置定位)fixed(相对于浏览器窗口定位)static(默认值,不定位,元素出现innormalflow)inherit(继承父元素position属性的值)sticky(relative和fixed的结合,当元素在屏幕内部是relative时,滚动出屏幕时显示为fixed)6.css3的新属性1.transfrom(旋转、缩放、移动或倾斜元素)、animation(动画效果)和transition(添加过渡效果)2.三种边框效果:border-radius(创建圆角边框)、border-shadow(阴影)、border-image(使用图片绘制边框)3.新增word-wrap、text-overflow和text-shadow、above等文字效果7.block、inline、inline的区别-块显示:blockblock元素也称为块级元素,独占一行,多个块元素各占一行默认情况下,块元素的宽度会自动填充父元素的宽度。您可以设置重量和宽度属性。如果块级元素设置了宽度或者占了单行,可以设置padding和margin属性。,多个内联元素会排成一排,只有排不下的时候才有效。宽度随元素的内容而变化。2.设置width和weight属性无效。3.内联元素的margin和padding属性在水平方向可以产生margin效果,在垂直方向没有效果显示:inline-blockinline块级元素具有内联元素的多重占用特性,设置的高度和宽度特性块元素并设置padding和margin特性8.display:none与visiblity:hidden的区别none时不占用空间,hidden时隐藏元素仍然占用空间。如果为none,会造成回流和重绘,当visibility:hidden时,只会发生重绘。visiblity:hidden的后代当元素设置为visiblity:hidden时,它将失效。9、什么是BFC,BFC用来解决什么问题?Formattingcontext:特点是内部子元素不会影响外部元素,可用于解决marginpenetration和clearafloatingblockformat上下文由以下之一创建:1)根元素或其他元素包含它2)浮动元素(元素的float不是none)3)绝对定位元素(元素的位置是absolute或fixed)4)内联块(元素Hasdisplay:inline-block)5)tablecell(元素hasdisplay:table-cell,HTMLtablecelldefaultattribute)6)tabletitle(elementhasdisplay:table-caption,HTMLtabletitledefaultattribute)7)hasoverflowandablockelementwithavalueotherthanvisible,8)display:flow-root9)column-span:all应该总是创建一个新的格式化上下文,即使带有column-span:all的元素没有包含在多列容器中。10.盒子模型有哪些,如何设置iE盒子模型:content(content+padding+border)+bordermarginheightandwidth包括padding和border标准盒子模型:content+padding+border+bordermarginheightandwidth参考内容通过box-sizing:content-box设置标准框模型,box-sizing:border-box设置ie框模型11、css选择器有哪些选择器?有id选择器、元素选择器、属性选择器、类选择器、后代选择器、子选择器、相邻兄弟选择器、伪类和伪元素。12、清除浮动的四种方式添加clear:both到浮动元素的样式中在浮动元素下方插入一个清除浮动的块级元素为浮动元素设置一个伪类,在伪类中设置显示为块状style,设置clear:both为BFC(格式??化上下文),比如浮动父元素设置overflow:auto13。如何用css实现一个三角形定义一个div元素,让其内容高度和宽度为0,通过border实现div{width:0;高度:0;边框:40px实心;border-color:transparenttransparentred;}上面的css样式通过设置底部边框为红色,其他边为透明,实现了一个底部宽40,高20的红色三角形。js1.addEventListener的第三个参数的作用是指定事件是在捕获阶段执行还是在冒泡阶段执行,true表示在捕获阶段执行,false是默认的,在冒泡阶段执行2.什么是事件冒泡,什么是事件捕获?开始,沿着文档一层层往上冒泡,直到documnent,事件捕获则相反,从documnet开始,沿着文档往下走,直到目标事件,3.如何防止事件冒泡和事件捕获即设置e。cancelBubble=true,设置e.stopProgation()来防止在w3c兼容的浏览器中事件冒泡,或者通过preventDefault来防止默认行为,因为事件处理的默认行为是冒泡或者使用stopImmediatePropagation()通过returnfalse来防止事件捕获,需要注意的是stopImmediatePropagation()也可以防止事件冒泡。调用后不仅会阻止父元素冒泡,还会执行该元素绑定的同类事件。4、typeof返回的数据类型有string、number、boolean、undefined、object、function5。列举三种强制类型转换和两种隐式类型转换强制(parseInt,parseFloat,number)implicit(=====)6.split()join()区别前者切割字符串形式为数组,后者转换7.ajax请求get和post方法get的区别主要是获取资源,post请求服务器端资源get通过url传输数据,post通过http的post机制,将要传输的数据放在request实体中发送给服务器get数据量小传输,post数据量大get不安全,post安全性高getcan只支持ASCII字符传输,传汉字会乱码;post支持标准字符集,可以传汉字8.call,apply,bind的区别通过一个对象,bind后面的参数也是一个对象,但是bind不会立即执行9.ajax请求时如何解析json数据使用JSON。对象转成json字符串10.什么是闭包,它有什么特点?闭包是一个可以读取函数内部变量的函数,这样函数就不会被GC回收。如果使用过多,会导致内存泄漏。11.Add,deleteandreplace插入到节点的方法创建一个新节点createElement()//创建一个特定的元素createTextNode()//创建一个文本节点Add,remove,replace,insertappendChild()//添加removeChild()//移除replaceChild()//替换insertBefore()//插入12、documentonload和doucmentreadyonload的区别是结构和样式、外部js和图片加载完成后执行js,ready是执行dom树创建之后,就是jquery的方法13.函数声明和函数表达式的区别函数声明在js解析的时候会被提升,所以在同一个作用域内,无论函数声明定义在什么地方,函数都可以14.null和undefined的区别null表示一个'空'对象,转换为0值,undefined是一个原始值,不代表什么,转换成一个值是NAN,声明变量,默认是undefined,null表示一个不存在的对象undefined表示一个未初始化的变量返回的值,null表示一个不存在的对象返回的值,undefined可以看成是一个空变量,null可以看成是一个空对象15.new操作符创建一个空对象有什么作用将创建的空对象的_proto_指向构造函数的原型来执行构造函数中的代码,而构造函数中的this指向对象返回对象(除非构造函数中返回一个对象或函数)16.实现深度克隆JSON。解析(JSON.stringify());17.什么是同源策略?这是一个浏览器协议。该脚本只允许访问同一站点的资源。协议相同,域名相同,端口号相同。其中19.js如何通过ID获取dom元素(getElementById,只获取一个元素,如果没有找到,则为null)通过名称(getElementByName,返回一个类数组,如果没有找到,则为空数组)通过标签名(getElementsByTagName,返回一个类数组,如果没有找到,将是一个空数组)通过类名(getElementByClassName,返回一个类数组,如果没有找到则为空数组)通过选择器获取一个元素(querySelector,返回值只取第一个元素)通过选择器获取所有元素(querySelectorAll,返回一个类数组)20.原生ajax请求步骤是什么//创建一个XMLHttpRequest对象varajax=newXMLHttpRequest();//指定请求的类型、url以及是否异步处理请求ajax.open('GET',url,true);//设置向服务器发送信息时的内容编码格式ajax.setRequestHeader('Content-type','application/x-www-from-urlencoded');//接受服务器响应数据ajax.onreadystatechange=function(){if(ajax.readyState===4&&am;ajax.status===200||ajax.status===304){}}//发送请求ajax.send(null);21.列出数组的对象方法方法说明push()addelementstotheendofthearraysplice()删除一个元素并向数组添加一个新元素unshift()addsanelementtotheheadofarraypop()移除数组末尾的一个元素shift()移除数组头部的一个元素slice()返回数组中的特定元素sort()对数组进行排序join()将数组的所有元素放入一个string,元素之间用指定的分隔符分隔concat()合并两个或多个数组,并合并reverse()反转数组中元素的顺序toString()把数组转换成字符串,结果valueOf()返回数组对象原值22.js实现数组去重1.es6实现函数deRep(arr){return[...newSet(arr)];}2.遍历数组函数deRep(arr){变量a=[];for(leti=0;i{prev.includes(cur)||prev.push(cur));返回上一个;},[]);}23.数组请求和1.使用递归functionsum(arr){letlen=arr.length;如果(len===0){返回0;}elseif(len===1){returnarr[0];}else{returnarr[0]+sum(arr.slice(1))}}2.forEach代函数sum(arr){letsumArr=arr;让总和=0;sumArr.forEach((val,index,arr)=>{sum+=val;},0);returnsum;}3.for循环累加functionsum(arr){letarr1=arr;让总和=0;for(leti=0;i{returnprev+cur;})returnsum;}24.数组排序1.冒泡排序functionsortArr(arr){if(arr.length<1){返回arr;}for(leti=0;i
2019js基础面试题整理复习相关文章