- 博客(22)
- 收藏
- 关注
RSS订阅原创 React 拖拽图片实现放大缩小功能
所以原因就是因为handleMouseMove中的e是document下的，而不是具体元素，所以movement计算方式有问题。“ 监听鼠标的位置，使用useRef记录初始鼠标点击位置，当触发handleMove函数时，计算鼠标移动距离`当我把handleMouseMove函数交给document监听后，之前实现的方式是``是跟随鼠标移动事件（mousemove event）更新的，而且``，之后再让图片的初始宽高+移动距离就是图片要被放大的距离 ``是以时间的目标元素为参考计算的 ”
2023-11-28 15:16:11
692
1
原创 git应用
一、掌握 git 工作流，掌握 git rebase，git commit --amend，了解 git push -f 的可用范围冲突提交历史git工作流：1、克隆代码：git clone2、创建一个自己的分支进行开发：git checkout -b feat_xxx3、开发完毕后提交分支：(1) git add .(3) git commit --verbose(verbose列出diff结果)4、：（1）git fetch origin（来同步远程服务器上的数据到本地）
2023-03-20 16:13:15
219
原创 vue知识
3、v-model（双向绑定）：数据从data流向页面，也能从页面流向data。一般用在表单累元素上（如：input，select等），v-model：value简写为v-model，因为v-model默认收集的就是value值。1、可以使用v-once指令，执行一次性的插值，当数据发生改变时，差值处的内容不会更新。1、注意：只有当实例被创建时就已经存在于data中的property才是响应式的。2、v-bind（单向绑定）：数据只能从data流向页面。指明的特殊后缀，用于指出一个指令应该以特殊方式绑定。
2023-03-20 16:07:16
123
原创 js判断数据类型的四种方法
1、typeofvar arr =[1,2,3] var obj ={name:"aaa"} var fn = function(){ alert(1) } console.log(typeof(1)); //number console.log(typeof("abc")); //string console.log(typeof(true)); //boolean
2022-04-13 12:40:38
1168
原创 css伪类选择器中:nth-child()和:nth-of-type()的区别
简单的html标签<p class="ni">段落1</p> <p class="ni">段落2</p> <p class="ni">段落3</p> <p>段落4</p> <span class="ni">span1</span><span class="ni">span2</span> <span class="
2022-04-07 11:46:21
563
原创 使用css实现不定宽高元素的垂直水平居中
给定三个li标签，使li元素的内部使用不同的方式实现垂直水平居中<ul> <li class="li1"> <p>123</p> </li> <li class="li2"> <p>123</p> </li> <li class="li3"><span
2022-04-04 11:38:51
1125
原创 js中的同步任务、异步任务 以及Promise的执行顺序
在js所有任务中，分为两种，一种是同步任务，一种是异步任务。同步任务是指，在js的主线程中执行的任务，只有前一个任务执行完毕，下一个任务才会开始执行。异步任务是指，不在主线程，而是在任务队列中的任务。只有主线程中的任务全部执行完毕，才会在任务队列中按顺序取出任务放入主线程再执行。而任务队列中存放的是有了结果的异步函数异步执行的机制就是：1、所有同步任务都在主线程上执行2、主线程外由一个任务队列，存放着有了结果的异步函数。3、当主线程中的所有同步任务执行完毕，就会读取任务队列中的异
2022-03-28 20:36:11
2656
原创 js中浅拷贝与深拷贝的区别及实现方法
浅拷贝：浅拷贝就是只拷贝一层，更深层次对象级别只拷贝引用（地址）当拷贝的新对象发生改变时，原对象也会发生相同的改变，也就是说，浅拷贝会影响原来的元素实现方法：1、直接赋值法：var arr = [1,2,3] var newarr = arr; newarr[1] = 5; console.log(arr,newarr);输出：[1, 5, 3]，[1, 5, 3]var obj = { name:'小明
2022-03-22 16:42:28
1999
1
原创 js中实现继承的方式
ES6 之前官方并没有提供一种实现继承的语法,所以大部分继承方式都是程序员通过代码在模拟.常见的继承方式有以下几种:1、原型继承原型继承可以继承构造函数中的属性，也可以继承原型链上的方法function Person(name, age) { this.type = 'human' this.name = name this.age = age } Person.prototype.sayName = function () { ...
2022-03-17 20:34:42
143
原创 js中如何解决跨域问题
首先介绍一下js的同源策略同源策略是浏览器的一项安全策略，浏览器只允许js 代码请求和当前所在服务器域名,端口,协议相同的数据接口上的数据,这就是同源策略.也就是说，当协议、域名、端口任意一个不相同时，都会产生跨域问题，所以又应该如何解决跨域问题呢？以下是三种解决跨域问题的方法：Jsonp--- 只能处理get请求，且不是ajax请求jsonp跨域的原理是什么?动态在页面中创建一个script标签，使其src属性指向后端数据接口，也就是说，script会发送一个get请求到sr.
2022-03-12 22:30:24
6639
原创 JS中关于不同函数调用this指向问题
1、全局作用域下或者普通函数调用：this指向window，（而严格模式下是undefined）console.log(this); //windowfunction fn(){ console.log(this); //window }fn();2、构造函数调用：this指向实例对象，原型方法中的this指向也是实例化对象function Funa(){ console.log(this);//this指向的
2022-03-05 20:38:28
352
原创 JS中Number、String、Boolean类型的数据转换方法
判断一个变量是不是数字NaN：not a number【特殊值】isNaN：is not a number【判断】用来判断一个值是否是数字，如果是数字得到的false，如果不是数字得到的是true转数值类型【Number，parseInt，parseFloat】取整 取浮点方法一：Number(变量)： 1. 在转换的过程中可以将原来的值保留，遇到小数直接保留下来，不会舍去 2. 如果变量无法转换为数值类型，那么返回的结果是NaN； 对应的数据类型...
2022-03-03 16:44:16
1298
原创 简单介绍JS构造函数中的原型
介绍每一个构造函数都有一个属性------即原型/原型对象prototype原型对象是构造函数的一个属性对象是构造函数创建出来的每一个构造函数都有一个 prototype 属性，指向另一个对象。 这个对象的所有属性和方法，都会被构造函数的实例继承。 也就是说，我们可以把所有实例对象所要共享的属性和方法直接定义在prototype对象上构造函数、实例、原型三者之间的关系构造函数的 prototype 对象默认都有一个 constructor 属性，指向 prototype 对象所.
2022-01-04 11:37:42
871
原创 Javascript基础中DOM总结
获取元素id获取元素：语法：document.getElementById('id的值');tagName获取元素集合：语法：document.getElementsByTagName('div'); //伪数组类名获得元素集合：语法：document.getElementsByClassName("类名") //伪数组选择器：获取单个：语法：document.querySelector('选择器');获取一组：语法：document...
2021-09-27 11:15:43
85
原创 Math、Date、Array、String内置对象总结
内置对象介绍JavaScript组成： ECMAScript | DOM | BOMECMAScript： 变量 ， 函数， 数据类型 ，流程控制，内置对象js中的对象： 自定义对象 ， 内置对象 ， 浏览器对象（不属于ECMAScript）Math对象提供了一系列与数学相关的方法或属性 ( 静态 | 实例)Math中的方法1、Math,PI --- 获取圆周率2、Math.random() --- 返回大于等于0小于1之间的随机数灵活使用：a：...
2021-09-14 22:53:29
198
原创 function,arguments,预解析,作用域链
首先，在JS的世界中，函数是一等公民，它有着很重要的作用。而什么是函数呢，它起着函数封装，和代码重复的左右（即在代码重复过多，就可以使用函数）创建函数：方法一：函数声明及执行方式（推荐）函数的声明：function 自定义函数名() { //一堆代码 具体的功能代码 一堆代码==>函数体 //函数体}注意： 1. 由于函数是用来实现某种特定功能代码，所以一般我们设置函数名的时候，以动词开始。 2. 函数不能自己...
2021-08-30 14:34:17
262
原创 for循环、while循环、do while循环
while循环基本语法：while(条件表达式) {； 代码（循环体）}循环变量初始化：定义一个变量给其初始化一个值 例如：var n = 1;循环条件的判断：作为循环是否继续执行的判断 例如：n <= 100;循环变量的变量：让变量改动，这样就能够避免让循环无限制执行 例如：n = n + 1;执行过程：1. 先条件判断结构是 true 还是 false2. 如果是true，那么程序会一直执行循环体中的代码3. 如果条件为false，那...
2021-08-23 15:34:36
852
原创 CSS中关于background的总结
背景图片 background-image：语法：background-image : none | url (url)参数：none : 无背景图（默认的） url : 使用绝对或相对地址指定背景图像background-image 属性允许指定一个图片展示在背景中（只有CSS3才可以多背景）背景平铺background-repeat语法：background-repeat : repeat | no-repeat | repeat-x | repeat-...
2021-08-17 22:42:45
406
原创 align-items是单行条件下决定侧轴的对齐方式，align-content是多行条件下决定侧轴的对齐方式，justify-content是设置主轴上元素的排列方式，flex-direction是
1.下列CSS选择器正确的是？ DA、.body .5（数字不能作为类名） B、.about body（body不能写在子代选择器中） C、title a（title不是标签） D、.about .body解：这道题运用了CSS复合选择器的知识点。交集选择器：第一个为标签选择器，第二个为class选择器，两个选择器之间不能有空格，如h3.special。（即h3和.special共有的属性）找到的标签必须满足：既有标签一的特点，也有标签二的特点。并集选择器：如果某些选择器定义的.
2021-08-02 18:44:33
587
原创 HTML基础中ul、ol、dl、form总结
无序列表：<ul> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> ......</ul>有序列表：<ol> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> ......</ol>有序列表的性...
2021-07-24 15:35:23
594
原创 关于HTML基础的标签知识
学习前端第十天，想用这个平台记录我的学习历程，如果有幸存在像跟我一样的小菜鸟，或者是大佬读到我的小文章，希望可以给出我一点点的小建议或者是能够指点迷津。
2021-07-22 11:12:43
108
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人