- 博客(49)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 webpack安装与使用（详细）
webpack是现代javascript应用程序的静态模块打包器，当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。webpack更加强调模块化开发管理，文件压缩、预处理等功能，是它附带的功能。注意：安装webpack ,要先安装node.js node.js自带了软件包管理工具npm1.查看node版本（node的安装自行查找，很简单）2.全局安装webpack,
2022-06-25 16:17:54
28655
1
原创 数组的方法
push()/*【1】push() 向数组中追加 数据添加到数组的末尾 改变原数组 返回值：添加数据之后 的数组长度 */ var arr = [0,2,3,4]; console.log(arr.push(99)); console.log(arr);unshift() 改变原数组 返回值：添加数据之后 的数组长度
2021-03-23 16:35:34
295
原创 手写bind、apply、call
1.手写bind:Function.prototype.myBind = function () { if (typeof this != 'function') { throw new TypeError('ERROR'); } //获取传递的参数 //Array.from() //1.复制数组，如果传的是数组，将把数组复制一份传给新数组。 //2.如果是伪数组，将会转成数组在赋给新数组。 // 获取参数 const args = Array.from(argum
2021-03-19 22:39:50
287
原创 前端面试题(一)
1.浏览器内核？1、IE浏览器内核：Trident内核（三叉戟），IE内核2、Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是Blink内核；3、Firefox浏览器内核：Gecko内核，俗称Firefox内核；4、Safari浏览器内核：Webkit内核；5、Opera浏览器内核：最初是自己的Presto内核，后来是Webkit，现在是Blink内核；6、360浏览器、猎豹浏览器内核：IE+Chrome双内核；7、搜狗、遨游、QQ浏览器内核
2021-03-19 12:44:27
423
原创 计算机网络重点知识汇总（面试题）
一 计算机网络体系结构：计算机网络的各层及其协议的集合就是网络的体系结构。（1）OSI（计算机网络体系结构的形成）国际标准化组织ISO提出著名的开放系统互连基本参考模型 OSI/RM（Open Systems Interconnection Reference Model）,简称OSI。只要遵循OSI标准，一个系统可以与世界上任何地方，也遵循这同一标准的其他任何系统进行通信。20实际九十年代初期，整套的OSI国际标准都已经制定出来了，但由于在这之前基于TCP/IP的互联网已经抢先在全球范围成功运转
2021-03-18 22:09:34
1352
1
原创 vue组件父子间传值
一、prop（官方）通过Prop向子组件传递数据： 我们可以在组件上注册一些自定义的属性, 值传给这个属性的时候，该属性就变成该组件实例的一个property,我们在组件实例中用props选项将这些属性包含在其中，然后我们就能在组件实例中访问这个值，就像访问data中的值一样。一个组件默认可以拥有任意数量的 prop，任何值都可以传递给任何 prop。Vue.component('blog-post', { props: ['title'], template: '<h3>{{ ti
2021-03-12 18:50:50
209
原创 vue脚手架（vue-cli）搭建
打开要建项目的目录，打开终端，安装：npm install -g @vue/cli## 安装成功后，检查vue --versionvue -V# Vue和VueCLI是两回事vue create 项目名称预设选项：选择预设功能（根据自身项目需要选择）按空格选择Babel=>转换工具，将ES6转换成ES5的转换工具，有些浏览器不支持ES6语法router=>路由管理器；VueX=>一个仓库，存储状态信息CSS pre-processor =>css预处
2021-03-12 16:14:09
286
1
原创 const注意点（对象赋值）
给const修饰的标识符被赋值后，不能修改；在使用const定义标识符，必须进行赋值常量的含义是指向的对象不能修改，但是可以改变对象内部的属性。 const obj = {//保存的是地址 name: 'why', age: 18, height: 1.88 } //不能写成obj={},相当于重新赋值，一个新的地址 console.log(obj); obj.name = 'kobe'; obj.age = 40;.
2021-03-11 00:11:13
827
原创 ES6作用域（let,给按钮循环添加点击事件问题）
ES5之前存在的问题：因为if和for都没有块级作用域的概念，所以很多时候都必须借助函数的作用域来解决使用外面变量的问题。 // 1.变量作用域：变量在什么范围内可用,但是使用var时没有作用域，上述都能够打印出why { var name = 'why'; console.log(name); } console.log(name);```javascript //2没有块级作用域引起的问题：if的块级 var fun;
2021-03-10 23:43:03
478
原创 vue数组双向绑定问题（数组更新检测、对象添加移除属性）
例子：三个列表数字首次渲染依次为100,200,300，点击对应的后面的按钮，要实现数字乘十，此时使用 this.arr[index]=this.arr[index]*10;进行更改的方式不起作用，改变了data中的arr数组，但是未能正确渲染到页面中。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content=
2021-03-10 13:08:44
7071
2
原创 vue的computed计算属性（getter、setter）、计算属性的缓存
vue计算属性：对于任何复杂逻辑,都选择使用计算属性<body> <div id="app"> <!--计算属性引用时不用加（），把其当作一个属性--> <h2>{{totalPrice}}</h2> </div> <script src="../js/vue.js"></script> <script> var vm=new Vue({ el:'#a
2021-03-10 09:17:45
615
2
原创 vscode添加vue模板
打开vscode,依次点击文件—》首选项—》用户片段：给代码块取名，点击enter:在文件中写入：prefix 是在页面输入的关键字{ "creat a vue template": { "prefix": "vue2", "body": [ "<!DOCTYPE html>", "<html lang=\"en\">", "<head>", "\t<meta charset=\"UTF-8
2021-03-09 18:13:09
263
2
原创 个人博客（练手小项目）
1. 使用：html,js,css,jquery2.功能：留言板：留言、留言评论、删除留言、点赞、登录注册笔记记录随笔3.代码结构：4.github地址：https://github.com/lee-xx2/blog.git5.效果展示：
2021-03-01 09:34:19
461
1
原创 form标签的enctype属性
enctype属性规定在将表单数据发送到服务器之前如何对其进行编码。也就是通过表单发送数据时默认的编码类型。只有在method = "post"时才能使用;属性值：（1）application/x-www.form-urlencoded:默认值，在发送前对所有字符进行编码（将空格转换为 “+” 符号，特殊字符转换为 ASCII HEX 值）。将数据编码成名值对的形式，是标准的编码格式。（2）multipart/form-data ：不对字符编码、！！！当使用有文件上传控件的表单时，使用该值。 比如.
2021-01-21 20:24:09
271
原创 ＜pre＞＜/pre＞、＜iframe＞＜/iframe＞、＜marquee＞＜/marquee＞
<pre></pre>在<pre>标签中能够预定义格式化的文本，在中的文本通常会保留空格和换行符，文本也会呈现等宽字体。<pre>标签的常见应用就是用来表示计算机的源代码。<pre>元素是块级元素<pre>只能包含文本和行内元素，块级元素不能放在其中制表符tab在<pre>标签定义的块当中可以起到应有的作用，每个制表符占据8个字符的位置，但并不推荐使用tab，因为在不同的浏览器中，tab的表现形式各不相同。在用&
2021-01-21 20:08:36
398
原创 js 放大镜（面向对象）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>放大镜</title> <script src="util.js"></script>.
2021-01-15 20:57:04
409
原创 圆周运动（Math.PI）、Math.cos(x)、Math.sin(x)
知识点：Math.cos(x): cos() 方法可返回一个数字的余弦值。返回的是 -1.0 到 1.0 之间的数。Math.sin(x): sin() 方法可返回一个数字的正弦值。返回的是 -1.0 到 1.0 之间的数。两个函数中的X 都是指的“弧度”而非“角度” 。弧度的计算公式为： 角度 *（PI/180）let h = deg * Math.PI / 180;![在这里插入图片描述](https://img-blog.csdnimg.cn/20210113173747165.gi
2021-01-13 17:52:40
2245
原创 原生js缓冲运动——》封装动画函数
缓冲运动缓冲运动： 在固定距离中做减速运动缓冲运动与减速运动的区别： 减速运动不确定最终停止的位置，缓冲运动在特定位置停止。效果：代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <
2021-01-13 16:54:44
298
2
原创 CSS3 animation-fill-mode 属性
animation-fill-mode 属性规定当动画不播放时（动画不播放有两种情形：当动画完成后不播放时，或当动画有设置延迟时间未开始播放时），要应用到元素的样式。默认情况下，CSS 动画在第一个关键帧播放完之前不会影响元素，在最后一个关键帧完成后停止影响元素。animation-fill-mode 属性可重写该行为。属性可选值：animation-fill-mode: none|forwards|backwards|both|initial|inherit;none 默认值。动画在动画执行之
2020-12-11 20:39:17
9450
原创 transition（过渡）与animation（动画）的区别
1.简写属性包含的属性：transition(过渡)属性： transition: property duration timing-function delay;transition-property：指定应用过渡的CSS属性的name，transition-duration：transition效果需要指定多少秒或毫秒才能完成transition-timing-function：指定transition效果的转速曲线transition-delay：始终指定transition-
2020-12-10 13:36:18
1472
原创 CSS渐变（linear-gradient、radial-gradient）
CSS3 渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。通过使用 CSS3 渐变（gradients），可以减少下载的时间和宽带的使用。此外，渐变效果的元素在放大时看起来效果更好，因为渐变（gradient）是由浏览器生成的。CSS3 定义了两种类型的渐变（gradients）：线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向径向渐变（Radial Gradients）- 由它们的中心定义一、线性渐变：语法：background:
2020-12-09 13:12:51
5587
1
原创 border-radius制作哆啦A梦
代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>多啦A梦</title> <style> * { .
2020-12-08 13:17:45
215
原创 border-radius(CSS3属性)
一、border-radius 完整写法：border-radius:为元素添加圆角边框。border-radius:10px 20px 30px 40px/40px 30px 20px 10px“/”前的四个数值表示圆角的水平半径，后面四个值表示圆角的垂直半径。水平半径和垂直半径表示如下：比如：border-radius: 2em 1em 4em / 0.5em 3em;等同于border-top-left-radius: 2em 0.5em;border-top-right-radi
2020-12-08 13:10:13
57536
原创 伪类选择器（:link :visited :hover :avtive Xnth-child(n) X: first-child X: last-child X:nth-of-type(n)...）
1. :link :visited :hover :avtivea:link {color:#FF0000;} /* 未访问的链接 */a:visited {color:#00FF00;} /* 已访问的链接 */a:hover {color:#FF00FF;} /* 鼠标划过链接 */a:active {color:#0000FF;} /* 已选中的链接 */顺序要求：- 在CSS定义中，a:hover要放在a:link和a:visited之后才有效；- a:active要放在a:hove
2020-12-07 16:43:02
317
原创 border缩写属性
border缩写属性：设置的属性分别（按顺序）：border-width, border-style,和border-color.如果上述值缺少一个没有关系，例如border：＃FF0000;是允许的。border其他属性用法：单个边的复合样式border-left:thick double #ff0000;单个边的某一具体样式：border-bottom-color:red;border-bottom-width:2px;border-bottom-style:solid;
2020-12-07 12:46:03
1685
1
原创 background相关属性及缩写属性
背景缩写属性：背景缩写属性可以在一个声明中设置所有的背景属性。background: #00ff00 url('smiley.gif') no-repeat fixed center; 可以设置的属性分别是：background-color、background-position、background-size、background-repeat、background-origin、background-clip、background-attachment和 background-image。
2020-12-07 10:10:59
2371
1
原创 背景图为精灵图的导航制作小练习（滑动门）
练习一- 效果： - 背景图素材：图片 nav.png图片nav-on.png代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="wid
2020-12-04 17:38:04
325
原创 CSS Sprites精灵图（雪碧图）的使用以及利用工具制作
CSS Sprites的原理（图片整合技术）----精灵图（雪碧图）原理：将导航背景图片、按钮背景图片等有规则的合并成一张背景图，将多张图片合为一张整图，然后用background-position来实现背景图片的定位技术。图片整合的优势：1）通过图片整合来减少对服务器的请求次数，从而提高页面的加载速度。2）通过整合图片来减小图片的体积。利用工具制作精灵图：使用ps创建图层，背景透明，将背景图复制到该图层中进行排列：将背景图全部选中拉进ps，依次双击出现每个图片，拖动进行
2020-12-04 16:16:01
1392
原创 表单相关标签（＜input＞ ＜fieldset＞ ＜button＞ ＜select＞ ＜label＞）
表单：<from></form><form name="" method="" action=""></form><!--action:规定当提交表单时向何处发送表单数据。 method: get/post 规定用于发送表单数据的 HTTP 方法。--><form> 元素包含一个或多个如下的表单元素：<input><textarea> ：文本框<button> ：按钮<
2020-12-03 20:45:40
458
3
原创 高度塌陷问题
高度塌陷：当子元素有浮动并且父元素没有设置高度的情况下父元素会出现高度塌陷<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>
2020-12-02 17:37:08
89
原创 visibility: hidden；与display:none；区别
visibility:hidden;和display:none;的区别： visibility:hidden;属性会使对象不可见，但该对象在网页所占的空间没有改变，等于留出了一块空白区域， display:none属性会使这个对象彻底消失不显示，也不再占用位置。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewp
2020-12-02 15:21:05
7042
原创 小练习：简单三级菜单的制作（ul li）
思路：列表嵌套列表，给一级菜单取名box,二级box2,三级box3, 一级菜单列表项li左浮动，默认初始状态二级和三级菜单都隐藏，鼠标滑过一级菜单列表项li,显示二级标签，划过二级菜单列表项li，显示三级菜单,三级菜单有定位问题，可以相对于二级菜单的li定位（使用“子元素绝对定位，父元素相对定位”），也可以相对于整个二级菜单.box2进行定位。<!DOCTYPE html><html lang="en"><head> <meta charset=
2020-12-02 10:46:01
1892
4
原创 html+css(锚点的使用)
命名锚点的作用：在同一页面内的不同位置进行跳转。通俗理解：可以通过锚点跳转到页面中的其他位置，当页面过长时，可以将页面分为几部分，通过顶部设置一些锚点，点击可以方便浏览者快速定位到相应的位置。制作锚标记： 1)给元素定义命名锚记名 语法：<标记 id="命名锚记名"> </标记> 2)命名锚记连接 语法：<a href="#命名锚记名称"></a>注意：href属性的属性值最前面要加
2020-12-01 18:52:03
3084
原创 导航栏练习
例1代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>鼠标滑过翻译</title></head><style> *{
2020-11-30 23:17:56
328
1
原创 CSS盒子模型
CSS盒子模型组成：content -> padding -> border -> margin（从内到外）①content: 内容区域 width和height组成的②padding: 内边距/内填充 padding:30px 30px; /padding:30px; 只写一个值：30px(表示上下左右) 写两个值：30px 40px (上下、左右) 写三个值（不建议）（上 左右 下） 写四个值：30px 40px 50px 60px（上 右
2020-11-27 15:51:15
412
原创 background背景
background-color:背景颜色 css中颜色表示法： 1.单词表示法 2.十六进制表示法 0 1 2 3 4 5 6 7 8 9 a b c d e f #ffffff 3.rgb三原色表示法：rgb(255 255 255); 取值范围：0~255 提取颜色的下载地址：https://www.baidufe.com/fehelperbackground-image:背景图片 （不用引号）backgr.
2020-11-27 13:17:38
491
原创 HTML5表格标签相关
制作表格如下：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>表格练习</title></head><body> <table border="
2020-11-25 12:49:51
333
原创 测试理论学习（分类、流程、方法）
一、软件测试将实际结果与预期结果做对比。软件测试是使用人工或自动的手段来运行或测定某个软件系统的过程，其目的在于检验它是否满足规定的需求或弄清预期结果与实际结果之间的差别。二、软件测试发展历程（三阶段）证明软件是正确的；证明软件是错误的；证明软件的质量是符合用户需求的一系列手段。三、软件测试的分类（1）根据测试方向分类（2）根据测试方法分类：（3）根据测试状态分类：（4）根据测试阶段分类：（5）根据测试对象分类：（6）其他分类：四、互联网研发团队结构研发管理模
2020-09-18 17:56:07
1260
原创 JS学习— 强制数据类型转换：Boolean()、Number()、parsetInt()、parsetFloat()
Boolean()将其他的数据类型强制转换成布尔值口诀：非0即真 （数字不是0，转换成布尔值都为true） 非空即真(字符串不为空，转换成布尔值都为true) alert(Boolean(-100));//true alert(Boolean(90));//true alert(Boolean(0));//false alert(Boolean("jij"));//true alert(Boolean("uiuuig"));//true ale..
2020-09-04 15:48:11
631
原创 JS学习—运算符（算数运算符、关系运算符、逻辑运算符、一元运算符、赋值运算符）
一、算数运算符 + - * / %（取余符号）计算机进行自动数据类型转换：不同数据类型之间没有办法进行运算，将数据转成同一数据类型，再进行计算。其中一个操作数是字符串，运算符是+号，别的数据类型转换成字符串，两个字符串会拼接起来。 alert('hello' + 100);//hello100 alert('hello' + true);//hellotrue alert('hello' + NaN);//helloNaN alert('hello' + undefi
2020-09-04 15:34:47
373
社团管理系统报告（面向对象系统分析与设计课程设计报告）.zip
2020-09-16
数据库课程设计报告（学生信息管理系统）.zip
2020-09-16
javaweb课程设计报告（人事管理系统）.zip
2020-09-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人