牛客网错题知识点整理——js_1

1.Blob对象

BLOB (binary large object),二进制大对象,是一个可以存储二进制文件的容器。

一个Blob对象就是一个包含有只读原始数据的类文件对象.实际上 file 对象只是 blob 对象的一个更具体的版本。

大型对象中:BLOB就是使用二进制保存数据。如:保存位图。CLOB使用CHAR来保存数据。如:保存XML文档。

2.form表单中input元素的readonly与disabled属性

设置readonly = true,页面上无法修改内容,但是可以通过JavaScript修改,内容会被提交。

设置disabled = true,无法修改内容,也不会被提交。

3.display 与 visibility

display:none和visibility:hidden的区别就是visibility:hidden会保留元素的空间。

repaint(重绘)改变元素的外观。是在没有改变布局的情况下发生,不会影响dom结构渲染。

reflow(渲染)会影响dom的结构渲染,同时会出发repaint,会改变本身和所有的父辈元素,会导致性能的下降。

display:none会产生reflow;visibility:hidden会发出repaint;

4.css3新增属性

1、box-shadow(阴影效果)

2、border-color(为边框设置多种颜色)

3、border-image(图片边框)

4、text-shadow(文本阴影)

5、text-overflow(文本截断)

6、word-wrap(自动换行)

7、border-radius(圆角边框)

8、opacity(透明度)

9、box-sizing(控制盒模型的组成模式)

10、resize(元素缩放)

11、outline(外边框)

12、background-size(指定背景图片尺寸)

13、background-origin(指定背景图片从哪里开始显示)

14、background-clip(指定背景图片从什么位置开始裁剪)

15、background(为一个元素指定多个背景)

16、hsl(通过色调、饱和度、亮度来指定颜色颜色值)

17、hsla(在hsl的基础上增加透明度设置)

18、rgba(基于rgb设置颜色,a设置透明度)

5.对于一个超链接代码的target属性:

_blank:在新窗口打开; _self:在当前窗口打开; _parent:在父级窗口打开; _top:在最顶级窗口打开

6.alt 和 title

alt是html标签的属性,而title既是html标签,又是html属性。 
title标签这个不用多说,网页的标题就是写在<title></title>这对标签之内的。 
title作为属性时,用来为元素提供额外说明信息。例如,给超链接标签a添加了title属性,把鼠标移动到该链接上面是,就会显示title的内容,以达到补充说明或者提示的效果。 
而alt属性则是用来指定替换文字,只能用在img、area和input元素中(包括applet元素),用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。

7. sub  sup 和 mark 标签

<sup></sup>上标

<sub></sub>下标

<mark></mark>突出显示

8.sessionStorage 、localStorage 和 cookie 之间的区别

8.1 cookie

1)概念

生命期为只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。 存放数据大小为4K左右 。有个数限制(各浏览器不同),一般不能超过20个。与服务器端通信:每次都会携带在HTTP头中,如果使用cookie保存过多数据会带来性能问题。但Cookie需要程序员自己封装,源生的Cookie接口不友好。

2)特点

cookie的优点:具有极高的扩展性和可用性

  1. 通过良好的变成,控制保存在cookie中的session对象的大小。
  2. 通过加密和安全传输技术,减少cookie被破解的可能性。
  3. 只在cookie中存放不敏感的数据。
  4. 控制cookie的生命周期,使之不会永远生效。

cookie的缺点:

  1. coockie的长度和数量的限制。每个domain最多只能有20条cookie,每个cookie长度不能超过4KB。
  2. 安全性问题。容易被截取到内部的session信息。
  3. 有些状态不可能保存在客户端

8.2 localStorage

1)概念

localStorage生命周期是永久,这意味着除非用户显示在浏览器提供的UI上清除localStorage信息,否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端(即浏览器)中保存,不参与和服务器的通信。

8.3 sessionStorage

1)概念

sessionStorage仅在当前会话下有效,关闭页面或浏览器后被清除。存放数据大小为一般为5MB,而且它仅在客户端(即浏览器)中保存,不参与和服务器的通信。源生接口可以接受,亦可再次封装来对Object和Array有更好的支持。

localStorage和sessionStorage区别:

不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的 localStorage(页面属于相同域名和端口),但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是,页面及标签页仅指顶级窗口,如果一个标签页包含多个iframe标签且他们属于同源页面,那么他们之间是可以共享sessionStorage的。

sessionStorage 、localStorage 和 cookie 之间的区别:

共同点:都是保存在浏览器端(客户端),且同源

区别:

  1. cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递;cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下。存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识。
  2. 而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。
  3. 数据有效期不同,sessionStorage:仅在当前浏览器窗口关闭前有效,自然也就不可能持久保持;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。
  4. 作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知机制,可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便。而cookie则需要自己编写。

9.置换元素/替换元素  和 非置换元素/不可替换元素

置换元素/替换元素:
1. 内容不受CSS视觉格式化模型控制,CSS渲染模型并不考虑对此内容的渲染,且元素本身一般拥有固有尺寸(宽度,高度,宽高比)的元素,被称之为置换元素。
2. 替换元素就是浏览器根据元素的标签和属性,来决定元素的具体显示内容。例如浏览器会根据img标签的src属性的值来读取图片信息并显示出来,而如果查看(X)HTML代码,则看不到图片的实际内容;又例如根据input标签的type属性来决定是显示输入框,还是单选按钮等。
3. HTML中的img、input、textarea、select、object都是替换元素。这些元素往往没有实际的内容,即是一个空元素。

非置换元素/不可替换元素 :

HTML 的大多数元素是不可替换元素,即其内容直接表现给用户端(例如浏览器)(除置换元素之外,所有的元素都是非置换元素。)

猜你喜欢

转载自blog.csdn.net/csdn_xuebing/article/details/82954222