自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

超级罗伯特的博客

唯有学习避免老年痴呆。

  • 博客(82)
  • 收藏
  • 关注

原创 Cookie、sessionStorage、localStorage 的区别

Cookie:cookie 数据始终在同源的 http 请求中携带(即使不需要),即 cookie 在浏。服务器,仅在本地保存。cookie 只在设置的 cookie 过期时间之前一直有效,即使窗口或浏览器关闭。本身就是一个回话过程,关闭浏览器后消失,session 为一个回话,当页面不同即使是。如果每次都需要选择所在地是烦琐的,当利用了 cookie 后就会显得很人性化了,那么可以使用 cookie 来记录用户的选项,例如:背景色、分辨率等。置过期时间,当超过时间期限后,cookie 就会自动消失。

2023-03-29 10:06:57 63

原创 fetch 发送 2 次请求的原因

fetch 发送 post 请求的时候,总是发送 2 次,第一次状态码是 204,第二次才成功?原因很简单,因为你用 fetch 的 post 请求的时候,导致 fetch 第一次发送了一个。Options 请求,询问服务器是否支持修改的请求头,如果服务器支持,则在第二次中发。

2023-03-29 10:06:18 596

原创 说一下 web worker

后,页面才变成可相应。web worker 是运行在后台的 js,独立于其他脚本,不会影响。并且通过 postMessage 将结果回传到主线程。这样在进行复杂操作的。在 HTML 页面中,如果在执行脚本时,页面的状态是不可相应的,直到脚本执行完成。创建 web worker 文件(js,回传函数等)检测浏览器对于 web worker 的支持性。创建 web worker 对象。时候,就不会阻塞主线程了。

2023-03-29 10:05:39 108

原创 说一下 HTML5 drag api

dragstart:事件主体是被拖放元素,在开始拖放被拖放元素时触发,。dragleave:事件主体是目标元素,在被拖放元素移出目标元素是触发。dragenter:事件主体是目标元素,在被拖放元素进入某元素时触发。dragover:事件主体是目标元素,在被拖放在某元素内移动时触发。drop:事件主体是目标元素,在目标元素完全接受被拖放元素时触发。dragend:事件主体是被拖放元素,在整个拖放操作结束时触发。darg:事件主体是被拖放元素,在正在拖放被拖放元素时触发。

2023-03-24 15:23:22 91

原创 说一下 web Quality(无障碍)

如果您使用了 alt 属性,那么浏览器至少可以显示或读出有关图像的描述。能够被残障人士使用的网站才能称得上一个易用的(易访问的)网站。残障人士指的是那些带有残疾或者身体不健康的用户。有时候浏览器会无法显示图像。浏览器是语音浏览器(供盲人和弱视人群使用)浏览器是不支持图形显示的迷你浏览器。

2023-03-24 15:22:16 71

原创 说一下 http2.0

首先补充一下,http 和 https 的区别,相比于 http,https 是基于 ssl 加密的 http 协。简要概括:http2.0 是基于 1999 年发布的 http1.0 之后的首次更新。改善了:在 http1.1 中,浏览器客户端在同一时间,针对同一域名下的请求有一定数。二进制分帧:HTTP2.0 会将所有的传输信息分割为更小的信息或者帧,并对他们进行二。提升访问速度(可以对于,请求资源所需时间更少,访问速度更快,相比 http1.0)量限制(连接数量),超过限制会被阻塞。

2023-03-24 15:22:13 109

原创 HTTP 请求的方式,HEAD 方式

head:类似于 get 请求,只不过返回的响应中没有具体的内容,用户获取报头。options:允许客户端查看服务器的性能,比如说服务器支持的请求方式等等。

2023-03-24 15:21:06 134

原创 几个很实用的 BOM 属性对象方法?

location.replace() -- 设置当前文档的 URL,并且在 history 对象的地址列表中移除。返回 8080location.protocol -- 返回 URL 中的协议部分。history.go() -- 前进或后退指定的页面数 history.go(num);location.hash -- 返回 URL#后面的内容,如果没有#,返回空。location.pathname -- 返回 URL 的域名后的部分。location.port -- 返回 URL 中的端口部分。

2023-03-24 15:20:39 86

原创 WebSocket 的实现和应用

和 HTTP1.1 都不支持持久性的链接,HTTP1.1 中的 keep-alive,将多个 http 请求合并。connection:Keep-alive,也就是说,在一个 Http 连接中,可以发送多个 Request,WebSocket 是 HTML5 中的协议,支持持久连续,http 协议不支持持久性连接。WebSocket 是基于 Http 协议的,或者说借用了 Http 协议来完成一部分握手,在握手阶。我们来看一个 websocket 握手协议的实现,基本是 2 个属性,

2023-03-24 15:20:19 116

原创 一个图片 url 访问后直接下载怎样实现?

请求的返回头里面,用于浏览器解析的重要参数就是 OSS 的 API 文档里面的返回 http。头,决定用户下载行为的参数。

2023-03-24 15:19:34 816

原创 TCP 和 UDP 的区别

并且因为 tcp 可靠,也就是说,通过 TCP 连接传送的数据,无差错,不丢失,(3)TCP 是面向字节流,UDP 面向报文,并且网络出现拥塞不会使得发送速率降低。(1)TCP 是面向连接的,udp 是无连接的即发送数据前不需要先建立链接。(4)TCP 只能是 1 对 1 的,UDP 支持 1 对 1,1 对多。(5)TCP 的首部较大为 20 字节,而 UDP 只有 8 字节。(因此会出现丢包,对实时的应用比如 IP 电话和视频会议等)。(6)TCP 是面向连接的可靠性传输,而 UDP 是不可靠的。

2023-03-24 15:19:31 46

原创 tcp 三次握手,一句话概括

从图片可以得到三次握手可以简化为:C 发起请求连接 S 确认,也发起连接 C 确认我们。二次握手:C 可以确认 S 收到了自己发送的报文段,并且可以确认 自己可以接受 S 发。再看看每次握手的作用:第一次握手:S 只可以确认 自己可以接受 C 发送的报文段第。送的报文段第三次握手:S 可以确认 C 收到了自己发送的报文段。客户端和服务端都需要直到各自可收发,因此需要三次握手。

2023-03-24 15:18:35 86

原创 http 和 https 差别在哪?

https: 是以安全为目标的 HTTP 通道,简单讲是 HTTP 的安全版,即 HTTP 下加入 SSL。http 的连接很简单,是无状态的;http 传输的数据都是未加密的,也就是明文的,网景公司设置了 SSL 协议来对 http 协。http 是超文本传输协议,信息是明文传输,https 则是具有安全性的 ssl 加密传输协。使用不同的链接方式,端口也不同,一般而言,http 协议的端口为 80,https 的端口。https 协议的主要作用是:建立一个信息安全通道,来确保数组的传输,确保网站的真。

2023-03-24 15:15:38 53

原创 JS高频面试题,请查阅,务必收藏持续更新

promise的总结:promise是一个处理异步操作的容器.它的主要作用:1.将回调地狱的写法改为平级调用2.包裹异步操作(用来处理请求和响应)3.promise的构造方法的参数时一个回调函数,该回调函数又有两个参数,也是回调函数4.通过then方法由外界传递回调函数给主函数其实就是为了通过回调函数获取响应值函数定义的方式a.}fun();b.}fun1();c.let fun2 = new Function(参数,代码);...

2022-08-16 22:44:06 497

原创 Vue核心高频面试题,这一篇就够了

原因:当你把一个普通的JavaScript对象传入Vue实例作为data选项,Vue将遍历此对象所有的属性,当使用Object.defineProperty劫持这些属性的操作,受JavaScript的限制,Vue不能检测到对象属性的动态添加或删除,由于Vue会在初始化实例对属性执行get set转化过程,所以属性必须在data对象上存在才能Vue转化它,这样才能让它是响应式的。MVC封装与业务无关的重复代码,形成框架,是模型(model)-视图(view)-控制器(controller)的缩写。...

2022-08-16 22:36:52 2083

原创 React核心面试题(高频面试题)这一篇就够了

5.函数组件ReactDOM.render的过程:随后调用该函数,将赶回的虚拟DOM转为真实DOM,随后呈现在页面中,类组件中ReactDOM.render的过程:new出该组件的实例,并通过该实例调用原型上的render方法,将render返回的虚拟DOM转为真实的DOM,随意偶呈现在页面中。高阶组件最大的特点就是重用组件逻辑。方式2:通过属性传递函数到子组件,子组件回调该函数将子组件的实例以参数的形式传给父组件并保存在父组件中,父组件拿到子组件的实例调用子组件的方法。...

2022-08-16 22:30:53 4476 3

原创 Javascript 重点笔记

01. 写出字符串的api有哪些 字符串截取的三个方法 str.substring(开始下标,结束下标) str.slice(开始下标,结束下标) str.substr(开始下标,长度) 字符串的替换 str = str.replace("sb","**") 字符串转数组 str.split("-"); var str = '12...

2022-05-27 01:16:21 71

原创 Javascript DOM项目笔记

02-操作元素内容 oDiv.innerHTML oDiv.innerHTML = '<h1></h1>' oDiv.innerText oDiv.innerText = '' oIpt.value oIpt.value = ''03-操作元素样式 1. oDiv.style.width = '' 2. oDiv.className = '' 3. oDiv.classL...

2022-05-27 01:14:36 127

原创 Javascript DOM笔记详细

1. window的属性有哪些? innerWidth innerHeight document history location screen2. window的方法有哪些? open() close() alert() prompt() confirm() var timer = setInterval(function(){},1000) clearInterval(timer) var timer ...

2022-05-27 01:12:21 62

原创 BOM和DOM知识点

0.对象 在 JavaScript 中,对象是⼀组⽆序的相关属性和⽅法的集合,所有的事物都是对象,例如字符 串、数值、数组、函数等。 对象是由属性和⽅法组成的。 属性:事物的特征,在对象中⽤属性来表示(常⽤名词) ⽅法:事物的⾏为,在对象中⽤⽅法来表示(常⽤动词) 定义对象: var obj = {name:"张三",age:18,sex:'⼥'} 对象属性的增删改 1. 点语法 增加属性 obj.weight = 80 obj.height = 130

2022-05-25 18:01:40 80

原创 DOM笔记知识点

DOM树概念:DOM以树状结构出现的,方便开发人员获取,添加,删除和修改页面上的某一部分DOM节点:DOM节点的概念:根据w3c,页面中的每一个部分都是一个节点,DOM节点的种类:节点包含一共有12种,本节课就认识5种节点 元素节点 属性节点 文本节点 注释节点 文档节点DOM节点的获取 父节点.childNodes 获取父节点中所有的子节点 ...

2022-05-25 17:55:50 126 2

原创 DOM知识点

DOM树概念:DOM以树状结构出现的,方便开发人员获取,添加,删除和修改页面上的某一部分DOM节点:DOM节点的概念:根据w3c,页面中的每一个部分都是一个节点,DOM节点的种类:节点包含一共有12种,本节课就认识5种节点 元素节点 属性节点 文本节点 注释节点 文档节点DOM节点的获取 父节点.childNodes 获取父节点中所有的子节点 ...

2022-05-25 17:54:13 195

原创 Javascript DOM知识点

1. 基本数据类型和引用数据类型的区别? 存储位置 存储的内容 存储的值和值相互之间 基本数据类型的变量: 栈内存 值 基本数据类型的变量和基本数据类型的变量之间相互不影响 引用数据类型的变量: 堆内存 地址 引用数据类型的变量和引用数据类型的变量公用一个地址,一个值变化,另外一个也会变化...

2022-05-25 17:53:24 440

原创 Javascript 笔记七

手动封装下面代码1. 编写函数map(arr)把数组中的每一位数字都增加30%。2. 编写函数has(arr,n)判断数组中是否存在n这个元素,返回布尔类型。3. 编写函数noRepeat(arr),数组去重4. 编写函数getMax(arr),找到数组中的最大值并返回写出ES5新增的数组APi arr.forEach(function(item,index){}) var newarr = arr.map(functio...

2022-05-21 09:14:23 70

原创 Javascript 笔记六

1. 什么是预解析? js引擎执行代码分为两步 1. 预解析 变量声明 函数声明 2. 代码执行2. 递归实现n的阶乘(收手写代码) function fn(n){ var res; if(n==1){ res = 1; }else{ res = n*fn(n-1) } return res...

2022-05-21 09:13:35 64

原创 Javascript 笔记五

1. 函数定义的两种方式 声明式 function fn(){} 赋值式,函数表达式 var fn = function(){} 区别?声明式调用可以上面也可以下面 赋值式 只能下面调用2. 函数封装的原则 函数的功能: 函数参数 函数返回值 /*功能:水仙花个数参数:2个返回值:水仙花个数*/3. 带return函数的特点函数的运行结果,可以用getN()来表示这个结果f...

2022-05-21 09:12:17 173

原创 Javascript 笔记四

1. 函数的定义语法 声明式定义函数 function 函数名([参数列表]){ 函数体; [return 值] } 声明变量 var s = 10;2. 函数的调用 函数名(参数列表)3. 函数参数分为几种 定义函数的参数 形参 function fn(a,b){ } 调用函数的参数 实参 fn(10,20) var x = prompt() var...

2022-05-21 09:11:21 284

原创 Javascript 笔记三

1. 检测变量是否是非数字的方法是? isNaN(变量) 结果:非数字为true。数字为false if嵌套2. switch语法格式? 注意点 switch(表达式){ case 常量表达式: 语句体; break; case 常量表达式: 语句体; break; 。。。 default: ...

2022-05-21 09:10:30 69

原创 Javascript 笔记二

1. 隐式数据类型的转换有哪些场景? 1. 数字+字符串 2. 数字 - 字符串 数字 * 字符串 数字 / 字符串 数字 % 字符串 3. 数字 == 字符串 数字 === 字符串 数字 > 字符串 数字 < 字符串2. 写出将字符串类型转为数字类型的三种语法?写出区别? Number(要转换的变量) ---》"100" "300" true ---&g...

2022-05-21 09:09:34 78

原创 Javascript 笔记一

1. js是什么?js的组成 运行在浏览器(客户端)端解释性脚本语句。 ECMAScript 定义js语法规范的 DOM 文档对象模型 定义操作文档的一系列方法 BOM 浏览器对象模型 定义操作浏览器的一系列方法2. js的数据类型有哪些,每种类型里有哪些内容? 基本数据类型 Number 数字类型 整数,小数,NaN,十进制,十六进制,二进制,八进制 Stri...

2022-05-21 09:08:35 201

原创 HTML+CSS笔记14

1. 多列属性有哪些? column-count: 3 column-gap: 10px column-rule: 1px solid green; column-fill: balance/auto column-span:none/all2. 媒体查询 @media screen (条件表达式){} @media screen (min-width:780px){} @media screen (max-width:780px){} ...

2022-05-21 09:06:20 63

原创 HTML + CSS笔记13

1. HTML5新增的标签有哪些?多媒体标签有哪些?属性是? header nav main footer section figture figturecaption article aside mark <video src='' autoplay='' muted loop poster controls></video> <video autoplay=''...

2022-05-19 09:41:24 55

原创 HTML + CSS 笔记12

0. 过渡属性 transition: all 2s linear 1s; transition-property: 过渡属性 transition-duration: 过渡持续的时间 transition-timing-function: 运动曲线 transition-timing-delay: 运动延迟了多久执行1. 2d设置属性和属性值 transfrom: scale(2,1) scaleX(2) sca...

2022-05-14 17:10:33 65

原创 HTML + CSS笔记11

1. 背景新增属性 background-size的值?以及区别 contain:等比缩放,当宽度或者高度铺满就停止缩放(存在缝隙) cover :等比缩放,当宽度或者高度都铺满就停止缩放2. 多背景的格式? background: url(), url();3. border是哪几个属性的复合写法? border-width: border-style: border-color:4. border-radius实现左上角的圆角弧度为10px,右上...

2022-05-14 17:09:38 71

原创 HTML笔记10

属性选择器? [属性名]{} [class]{} [class ^= 'box-']{} [class $= 'box']{} [class *= 'box']{} [class= 'box']{} 结构伪类选择器有哪些? 1. 第一个 :first-child body :first-child{} body p:first-child{} ...

2022-05-14 17:08:38 233

原创 HTML笔记9

1. BFC可以解决哪些问题? 1.1 浮动元素父元素高度坍塌 1.2 父子上下外边距重合 1.3 兄弟上下外边距重合 如何触发BFC? float:none position:不是none或者relative display:flex overflow:hidden2. overflow的值有哪些? hidden visible(默认值) auto scrollauto和 ...

2022-05-14 17:07:54 54

原创 HTML笔记8

01. 表格的标签有哪些? table tr td caption:可写可不写,写的话用于做表格专用标题 th:可写可不写,写的话用于做表格标题的单元格 th是td的变异体,都是单元格02. 表格的table上的属性有哪些? border width height bgcolor background = './1.jpg' (./ 可以省略) bordercolor: 边框颜色 a...

2022-05-14 17:06:43 73

原创 HTML笔记7

1. 定位的属性是什么?属性值有哪些 position static absolute relative fixed sticky2. 绝对定位的特点 2.1 脱标 2.2 设置了绝对定位,但是不设置便宜量,位置不变。 2.3 设置了绝对定位,设置偏移量,相对于离他最近具有定位的父级元素来定位,都没有相对于浏览器窗口来定位 2.4 设置了绝对定位,行内元素可以设置宽度和高度了,块元素大小由内容来决定...

2022-05-14 17:05:18 72

原创 HTML笔记6

行内元素 特点: 和其它行内元素或者行内块排在一起,不可以设置宽度高度。宽高由内容决定 哪些元素:a b span块元素 特点: 独占一行,可以设置宽度高度。宽度默认是父容器的宽度,高度由内容决定 哪些元素: h1 p div,ul li form dl dt dd ol h1:上下外边距21.44px p:上下外边距16px ul:上下外边距16px,左内边距40px行内块元素 特点:可以设置宽度高度,和其它行内元素或者行内块排在一起,行内块...

2022-05-14 17:04:29 65

原创 HTML笔记5

1. bakcground属性由哪几个属性组成 bakcground-color bakcground-image bakcground-repeat bakcground-position: bakcground: red url() repeat 10px 10px; bakcground-size: 100px 100px; bakcground-size: 100px auto;2. 企业站头部实现思路 <div class='he...

2022-05-14 17:03:48 55

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除