标签:提高 定位元素 form 存在 解决 宽高 tps 直接 tab
一,JS有哪些基本的数据类型?基本数据类型和引用数据类型有什么区别?
基本数据类型:number、Boolean、null、string、undefined、symbol(ES6)
引用数据类型(对象数据类型):Object、Array、Function
区别:
1、声明变量时内存的分配不同
基本数据类型存放在栈中;
引用数据类型存放在堆中;
2、访问方式不同
基本数据类型直接访问;
引用数据类型要先得到的是这个对象在堆内存中的地址,然后再按照这个地址去获得这个对象中的值,这就是传说中的按引用访问。
3.复制变量时不同
基本数据类型复制变量时,新生变量宛若新个体,不影响原来的变量
引用数据类型复制变量后,一旦新变量发生变化,旧变量也随之变化
4.参数传递的不同
基本数据类型:只是把变量里的值传递给参数,之后参数和这个变量互不影响。
引用数据类型:对象变量它里面的值是这个对象在堆内存中的内存地址,这一点你要时刻铭记在心!因此它传递的值也就是这个内存地址,这也就是为什么函数内部对这个参数的修改会体现在外部的原因了,因为它们都指向同一个对象。
详解请看:https://www.cnblogs.com/cxying93/p/6106469.html
二、介绍箭头函数和普通函数的区别?
1.箭头函数相当于匿名函数,是不能作为构造函数的,不能够使用new
2.箭头函数不绑定arguments,取而代之用rest参数...解决
3.箭头函数会捕获其所在上下文的this值,作为自己的this值。即箭头函数的作用域会继承自外围的作用域。
4.箭头函数当方法使用的时候没有定义this的绑定
5.通过call()或者apply()调用一个函数时,只是传入参数而已,对this并没有影响。
6.箭头函数不能当做Generator函数,不能使用yield关键字
7.箭头函数没有函数原型
8.箭头函数不能换行
三、常见的HTTP请求头有哪些?HTTP状态码404与301分别代表什么?
Accept: 允许哪些媒体类型。 Accept-Charset: 允许哪些字符集。 Accept-Encoding: 允许哪些编码。 Accept-Language: 允许哪些语言。 Cache-Control: 缓存策略,如no-cache,详见官方文档。 Connection: 连接选项,例如是否允许代理。 Host: 请求的主机。 If-None-Match: 判断请求实体的Etag是否包含在If-None-Match中,如果包含,则返回304,使用缓存,见Etag。 If-Modified-Since: 判断修改时间是否一致,如果一致,则使用缓存,。 、 If-Match: 与If-None-Match相反。 If-Unmodified-Since: 与If-Modified-Since相反。 Referer: 表明这个请求发起的源头。 User-Agent: 这个大家相信应该很熟悉了,就是经常用来做浏览器检测的userAgent。 Cache-Control: 缓存策略,如max-age:100,详见官方文档。 Connection: 连接选项,例如是否允许代理。 Content-Encoding: 返回内容的编码,如gzip。 Content-Language: 返回内容的语言。 Content-Length: 返回内容的字节长度。 Content-Type: 返回内容的媒体类型,如text/html。 Data: 返回时间。 Etag: entity tag,实体标签,给每个实体生成一个单独的值,用于客户端缓存,与If-None-Match配合使用。 Expires: 设置缓存过期时间,Cache-Control也会相应变化。 Last-Modified: 最近修改时间,用于客户端缓存,与If-Modified-Since配合使用。 Pragma: 似乎和Cache-Control差不多,用于旧的浏览器。 Server: 服务器信息。 Vary: WEB服务器用该头部的内容告诉 Cache 服务器,在什么条件下才能用本响应所返回的对象响应后续的请求。假如源WEB服务器在接到第一个请求消息时,其响应消息的头部为:Content-Encoding: gzip; Vary: Content-Encoding那么 Cache 服务器会分析后续请求消息的头部,检查其 Accept-Encoding,是否跟先前响应的 Vary 头部值一致,即是否使用相同的内容编码方法,这样就可以防止 Cache 服务器用自己 Cache 里面压缩后的实体响应给不具备解压能力的浏览器。
一些常见的状态码为:
200 - 服务器成功返回网页
404 - 请求的网页不存在
503 - 服务器超时
301(永久移动)请求的网页已永久移动到新位置。服务器返回此响应(对 GET 或 HEAD 请求的响应)时,会自动将请求者转到新位置。您应使用此代码告诉 Googlebot 某个网页或网站已永久移动到新位置。
四、清除浮动的几种方式,各自优缺点
(1:使用空标签清除浮动clear:both。
原理:添加一个空div,利用css提高的clear:both清除浮动,让父级div能自动获取到高度
优点:通俗易懂,容易掌握
缺点:会添加很多无意义的空标签,有违结构与表现的分离,在后期维护中将是噩梦
建议:不推荐使用,但此方法是以前主要使用的一种清除浮动方法
(2:父级div定义overflow:hidden
原理:必须定义width或zoom:1,同时不能定义height,使用overflow:hidden时,浏览器会自动检查浮动区域的高度
优点:简单,代码少,浏览器支持好
缺点:不能和position配合使用,因为超出的尺寸的会被隐藏
建议:只推荐没有使用position或对overflow:hidden理解比较深的朋友使用
(3:父级div定义伪类:after和zoom(用于非IE浏览器)
原理:IE8以上和非IE浏览器才支持:after,原理和方法1有点类似,zoom(IE转有属性)可解决ie6,ie7浮动问题
优点:浏览器支持好,不容易出现怪问题(目前:大型网站都有使用,如:腾迅,网易,新浪等等)。
缺点:代码多,要两句代码结合使用,才能让主流浏览器都支持
建议:推荐使用,建议定义公共类,以减少CSS代码
五、如何居中不定宽高的div
提供三种方法,供参考
使用Flex
只需要在父盒子设置:display: flex; justify-content: center;align-items: center;
使用 CSS3 transform
父盒子设置:position:relative
Div 设置: transform: translate(-50%,-50%);position: absolute;top: 50%;left: 50%;
使用 display:table-cell 方法
父盒子设置:display:table-cell; text-align:center;vertical-align:middle;
Div 设置: display:inline-block;vertical-align:middle;
六、relative与absolute的有什么不同?
1、文档流不同
relative 不脱离文档流,absolute 脱离文档流。
2、分级不同
relative 参考自身静态位置通过 top(上),bottom(下),left(左),right(右) 定位,并且可以通过z-index进行层次分级。
absolute通过 top,bottom,left,right 定位。选取其最近的父级定位元素,当父级 position 为 static 时,absolute元素将以body坐标原点进行定位,可以通过z-index进行层次分级。
3、定位不同
absolute是绝对定位,绝对定位就是相对于父元素的定位,不受父元素内其他子元素的影响;
而relative是相对定位,相对定位是相对于同级元素的定位,也就是上一个同级元素。
七、什么是cookie?cookie能做什么事和有什么意义?
Cookie 是一小段文本信息,伴随着用户请求和页面在 Web 服务器和浏览器之间传递。用户每次访问站点时,Web 应用程序都可以读取 Cookie 包含的信息。
cookie帮助 Web 站点保存有关访问者的信息
八、介绍下对浏览器内核的理解?
主要分成两个部分:渲染引擎(Render Engine)和JS引擎。
渲染引擎:负责取得网页的内容(html,xml和图像等),整理讯息(例如假如css),以及计算网页的显示方式,然后输出到显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同,所以渲染的效果也不同。所有网页浏览器、电子邮件客户端以及它需要编辑、显示网络内容的应用程序都需要内核。
JS引擎:解析和执行JavaScript来实现网页的动态效果。
常见的浏览器内核有哪些?
Trident内核:IE,360,搜过浏览器;
Gecko内核:Netscape6及以上版本,
Presto内核:Opera
Blink内核:Opera;
Webkit内核:Safari,Chrome
标签:提高 定位元素 form 存在 解决 宽高 tps 直接 tab
原文地址:https://www.cnblogs.com/smile-xin/p/11643409.html