- 博客(115)
- 收藏
- 关注
RSS订阅
1原创 解决vuex数据刷新消失的问题
办法一：将vuex中的数据直接保存到浏览器缓存中（sessionStorage、localStorage、cookie）办法二：在页面刷新的时候再次请求远程数据，使之动态更新vuex数据
2022-06-11 09:40:20
843
原创 http协议和https协议
http:超文本传输协议,是客户端和服务端数据传输的一种约定方式，默认端口80.是有请求行，请求头，请求正文组成的http缺点:http协议是明文传输的，信息容易被窃取。数据的完整性没有校验，容易被篡改，没有验证对方的身份，存在冒充的危险。为了jie j 上述的问题，https就出现了。什么是https？https是有http和ssl组成，是通过ssl证书来验证服务器的身份，并且为客户端和服务端之间的通信提供加密传输。https传输流程:............
2022-06-11 09:02:44
167
原创 对闭包的理解
如何形成的呢?外层函数的变量被嵌套在函数体内部的函数引用着，导致外部变量无法释放，就形成了闭包。作用？当外部想要访问内部变量，但是又不想定义一个全局变量造成全局污染的时候，就可以使用闭包。缺点:闭包闭正常函数多一个作用域对象，正常函数只有两个作用域对象，一个是自身函数体内部定义的变量，另一个是全局变量，而闭包多个一个外层函数作用域对象，因此比正常函数占用空间。...
2022-06-11 08:44:28
120
原创 JS深浅拷贝
浅拷贝:如果要拷贝的是基本数据类型，则浅拷贝可以实现。如果是引用类型的数据，浅拷贝只是实现了对内存地址的引用，修改原数据，会影响拷贝的数据。深拷贝:实现了对数据和内存地址的拷贝，相当于重新开辟了空间存储数据和内存地址。如何实现深拷贝:1.将对象通过json.stringfy转化为字符串,赋值给新变量,再将该新变量通过json.parse转为对象;2.递归实现......
2022-06-11 08:37:39
95
原创 CSS清除浮动的方式
1.利用overflow属性(除了visible)形成BFC结界2.给父元素添加伪元素3.在父元素的最后一个子元素清除浮动带来的影响
2022-06-08 20:00:28
81
原创 作用域和作用域链
1.作用域a.什么是:保存一个变量的可用范围b.js中包括两级作用域 :全局作用域和函数作用域2.作用域的原理定义函数时，每个函数身上都会保存全局变量和函数体内部自己创建的变量，调用函数时，临时创建作用域对象，并将作用域对象保存起来，每用到一个变量，函数首先会在自身查找，如果找不到才会去全局查找，遵循就近原则。函数调用完成后，会清楚在函数体内部创建的变量，所以局部变量在函数调用完成后就不能在用了。3.作用域链什么是？保存着一个函数所有可用的作用域对象的链式结构...
2022-06-06 10:35:25
80
原创 JS中如何实现重载
什么是重载?相同函数名，不同形参列表的多个函数,可以在调用时根据传入的实参值的不同,执行不同的逻辑。好处:减少函数名的个数，减轻调用者的负担如何实现呢?在JS中是禁止两个同名函数同时存在的，如果同时存在，后面定义的函数会覆盖前面的函数,可以借助arguments来解决。什么是arguments？函数中自带的，不需要自己定义，它是一个类数组对象。什么是类数组？长得像数组，有下标，有length属性，也可以循环。不同的是数组是Array类型的对象，类数组是Object对象。类数组无权使用数组的方法如何实现重载？
2022-06-06 10:19:41
2261
原创 axios取消发送请求
const CancelToken = axios.CancelToken;let cancel;axios.get('/user/12345', { cancelToken: new CancelToken(function executor(c) { // An executor function receives a cancel function as a parameter cancel = c; })});// cancel the requestcanc.
2022-03-07 18:20:48
233
原创 axios拦截器
const instance = axios.create({// 这里设置 baseURL 开发时跟后端连接，会有跨域的问题。比较合适的方法是在 vue.config.js 中通过 proxy 来转发请求。// 那样是通过 webpack-dev-server 转发，没有跨域问题。// baseURL: 'https://cqc.mtec.cc',timeout: 120000,});// 添加请求拦截器instance.interceptors.request.use(
2022-03-07 18:14:22
127
原创 axios发送请求的几种方式
// axios.defaults.baseurl //默认请求url// axios.defaults.timeout//请求超时后起订取消axios({methods: "get",baseurl:"http://localhost:3000",url:" /posts",params:{}}).then(res=>{console.log(res)})// 创建实例对象发送请求const obj = axios.create({base
2022-03-07 18:13:15
1470
原创 BOM操作
监听浏览器窗口大小的变化window.onresize = function(){}在当前窗口打开，可后退window.open("http://tmooc.cn", "_self");<a href="http://tmooc.cn" target="_self">go to tmooc</a>在新窗口打开，可打开多个window.open("http://tmooc.cn", "_blank");<a href="http://tmooc.cn"
2022-03-03 12:11:37
79
原创 如何在DOM中添加元素
1.创建一个新的空元素对象var a = document.createElement("标签名")2.为新元素添加必要属性例如：a.innerHTML = "内容"3.将元素添加在DOM中1.在父元素末尾追加新元素父元素.appendChild(新元素)2.在父元素下插入到一个现有的子元素之前父元素.insertbefore(新元素,现有子元素)3.替换父元素中现有的子元素父元素.replaceChild(新元素,子元素)var frag = documen
2022-03-03 11:10:20
2805
原创 DOM中修改样式
1.修改内联样式元素.style.css属性 = css属性值有些css属性名中带-，必须去掉-变成驼峰2.获取样式只要想获得元素的任意CSS样式，都必须使用计算后的样式如何获取计算后的样式？a.先获得计算后的样式对象1).先获得计算后的样式对象var bg = document.getElementById("bg")var style = getComputedStyle(bg)2)从样式对象中只提取所需要的css属性style.css属性
2022-03-02 16:06:19
449
原创 HTML5自定义属性
HTML5自定义属性必须以data-开头(前缀)在HTML中以data-开头，在js可以使用元素.dataset.属性名访问<body><button data-n="0" data-btn="">按钮</button></body><script>var btn = document.querySelector("[data-btn]")btn.onclick = function(){// var n = par
2022-03-02 15:06:21
386
原创 DOM中查找元素
1.按id名称查找元素var ulNav =document.getElementById("nav")如果找到则返回元素对象，如果没有找到则返回null2.按标签名查找元素在指定父元素内通过标签名获取多个元素var 类数组对象 = 任意父元素.getElementsByTagName("标签名")如果找到，则返回类数组对象，没有找到则返回空类数组3.按class名查找元素var 类数组对象 = 任意父元素.getElementsByClassName("item")
2022-02-28 16:32:02
503
原创 DOM中四种不需要查找的元素
根节点对象console.log(document) html元素节点对象document.documentElement head元素节点对象document.head body元素节点对象两种输出方式{console.log(span)//输出元素树形结构console.dir()//输出属性和值}
2022-02-28 14:37:23
89
原创 POST请求与GET请求的区别
GET请求是明文的会在地址栏显示传递参数，POST请求不会，因此GET比POST更不安全，参数直接暴露在地址栏中，所以不能用来传递敏感信息 GET请求在URL中传送的参数是有长度限制的，而POST没有 GET参数通过URL传递，POST放在request body中 GET只能发送字符串，POST理论上可以发送任何东西，因此需要设置表头 if(window.XMLHttpRequest){ var xmr = new XMLHttpRequest() }else{ var xmr =
2022-02-28 13:02:42
368
原创 Ajax 传参的两种方式
1.ajax原生的传参方式xhr.open('GET', '/selectone?uname=tom&uphone=15201076723', true) 2.resultful风格的传参方式使⽤get请求⽅式传递参数，直接在URL后⾯加参数，restful ⻛格传参⽅式直接使⽤ / 将参 数进⾏分隔，参数个格式为 /routes/value1/value2xhr.open('GET', '/restfulone/tom/15201076723', true);...
2022-02-26 18:32:02
2524
原创 Ajax如何解决异步数据接受问题?
当发送异步请求时,可以检测到对象的readyState属性。该属性表示请求/响应过程的当前活动阶段if(window.XMLHttpRequest){var xhr = new XMLHttpRequest()}else{var xhr = new ActiveXObject("Microsoft.XMLHTTP")}xhr.open("GET","http://localhost:5001",true)xhr.send()xhr.onreadystatechan
2022-02-26 12:07:56
214
原创 Ajax用法
1.创建异步请求对象(兼容性写法)if(window.XMLHttpRequest){var xhr = new XMLHttpRequest()}else{var xhr = new ActiveXObject("Microsoft.XMLHTTP")}2.创建异步请求xhr.open("GET","http://localhost:5001",true)3.发送异步请求xhr.send()4.接受相应,等待结果var result = xhr.response
2022-02-26 11:14:02
163
原创 响应式中的媒体查询
@media screen and (min-width:500px) and (max-width:700px){body{background-color: red;}}移动端不能写死的像素vh,vw代表视图窗口的高度和宽度，vh，vw永远参照视图窗口的高度和宽度，和父级无关
2022-02-23 10:41:41
174
原创 CSS动画效果
animation创建一个剧本(关键帧)@keyframes erwang{0%{transform: rotate(0);}100%{transform: translateX(300px);}}使用剧本(关键帧)animation-name: erwang;剧本使用时间animation-duration: 2s;动画的运动方式animation-timing-function动画执行完后的状态animation-fill-mode forwa
2022-02-22 11:23:54
77
原创 CSS变化属性
transform四个最常用的变化函数translate位移scale缩放,如果是负值则为镜面翻转rotate旋转skew扭曲transform-origin改变元素的基点
2022-02-22 09:29:44
138
原创 CSS过度属性
transition该属性应该写在没有触发该元素之前transition-property: width;过度的属性transition-duration: 1s;过度的时间transition-timing-function过的的方式:ease先慢后快最后慢ease-in先慢后越来越快ease-in-out开始和结束都很慢,中间很快ease-out先快,后越来越慢linear匀速transition-delay: 1s;过度延迟时间简写transtion:执行时
2022-02-20 15:51:25
233
原创 CSS弹性布局
容器和项目使用flex布局的元素(父元素)称为容器他的所有子元素自动成为容器的成员，称为项目他们各自有控制布局的属性，必须是容器包裹着的项目2.将容器指定为flex布局display: flex;3.指定轴排序方向默认是row代表,默认情况下，不管子元素写了多少，都会挤在父元素指定宽度和高度内指定容器是否让项目换行flex-wrap: wrap;//换行flex-wrap: no-wrap //不换行flex-w...
2022-02-19 17:39:37
270
原创 CSS高级选择器
凡是有class属性的元素被选中[class]{color: red;}凡是有id属性的元素被选中[id]{color: blue;}多个属性都具备的元素被选中[id][class]{color: red;}指定筛选属性和值[class="b"]{color: green;}//class = "b"小众属性[checked] + label{background-color: red;}//input。包含checked属性以
2022-02-19 12:00:18
189
原创 CSS中的渐变
线性渐变background-image: linear-gradient(red,orange,yellow,green,rgb(73, 148, 73),blue,purple);也可以指定角度方向渐变background-image: linear-gradient(45deg,green,yellow,也可以指定渐变的方向background-image: linear-gradient(90deg,blue 0 100px,white 100px 200px,red 200px 3
2022-02-19 10:13:21
246
原创 position定位
相对定位的特点相对的是自己原来该在的位置 不脱离文档流绝对定位的特点绝对定位会造成父元素高度不被撑开，只能给父元素增加高度解决 要有一个父级，并且父级需要有定位属性固定定位的特点参照物是浏览器窗口...
2022-02-18 15:07:28
86
原创 清除float带来的影响
清除浮动并不是去除浮动，而是将浮动带来的负面效果解决掉，因为浮动会产生高度坍塌浮动的影响父元素无高度父元素无高度后，父元素的兄弟元素会向上如何解决浮动带来的问题？利用高度解决(给父元素高度，弊端是未必知道子元素的高度) 父元素也浮动(会影响父元素的兄弟元素) 父元素溢出隐藏(overflow) 使用伪元素模拟在父元素最后创建一个空白标签 .baba::after{ content: ""; display: block; clear: both; } ...
2022-02-18 10:54:53
240
原创 CSS文档流
默认文档流脱离文档流float 子元素的浮动是参考父元素的最左侧和最右侧，当子元素浮动时，不再撑起父元素高度 当内联元素设置浮动之后，自动变成块级元素 元素浮动后不再独占一行 元素浮动后不会对前面的文档流中的兄弟元素产生影响 元素浮动后会对后面的文档浏中的兄弟元素产生影响，会遮盖后面的兄弟元素 浮动元素仍受父元素的影响，还在父元素的范围内 当父元素内的所有元素浮动时，元素们的宽度相加大于父元素的宽度时，会自动换行 当元素浮动时虽然不会独占一行，但会向前占位，前方空置的位置都会属于自己所
2022-02-18 09:49:34
105
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人