Yuki大魔王-CSDN博客

原创 Javascript中遍历数组的四种方法

for循环(ES1)var arr = [2,43,22,1]for(let i = 0; i < arr.length; i++){ console.log(arr[i]);}// 2// 43// 22// 1for 循环的优缺点是什么？它用途广泛，但是当我们要遍历数组时也很麻烦。如果我们不想从第一个数组元素开始循环时它仍然很有用，用其他的循环机制很难做到这一点。.forEach()(ES5)var arr = [2,43,22,1]arr.forEac

2021-09-29 19:55:25 389

原创 DOM事件委托机制

在 JavaScript 中，页面中事件处理程序的数量与页面整体性能直接相关。原因有很多。首先，每个函数都是对象，都占用内存空间，对象越多，性能越差。其次，为指定事件处理程序所需访问 DOM 的次数会先期造成整个页面交互的延迟。只要在使用事件处理程序时多注意一些方法，就可以改善页面性能。事件委托就是当事件触发时，把要做的事委托给父元素（或父元素的父元素）来处理。也就是：利用事件冒泡的原理，把事件加到父级上，通过判断事件来源的子集，执行相应的操作。使用事件委托技术能让你避免对特定的每个节点添加事件监听器。

2021-09-28 19:31:37 158

原创 JavaScript中的this指向问题及this指向的修改

面向对象语言中 this 表示当前对象的一个引用。但在 JavaScript 中 this 不是固定不变的，它会随着执行环境的改变而改变。在方法中，this 表示该方法所属的对象。如果单独使用，this 表示全局对象。在函数中，this 表示全局对象。在事件中，this 表示接收事件的元素。在显式函数绑定时，我们可以自己决定this的指向实例var person = { firstName: "LeBron", lastName : "James", id : 8

2021-09-22 15:00:15 583

原创 CSS实现元素水平垂直居中

1.absolute定位+自适应边距html<div class="father"> <div class="son"></div> </div>css.father{ position: relative; /* 设置父元素定位 */ width: 200px; height: 200px; border: 2px solid black; } .son{ wi

2021-09-16 17:12:32 111

原创 CSS实现垂直居中

1.用line-height实现当需要居中的元素是有内容的行内元素或者文字时，只需要设置父容器line-height即可实现垂直居中。html<div class="content"> <span>Diana</span></div>CSS.content{ width: 100px; line-height: 500px; border: 2px solid black; } span

2021-09-16 09:10:23 178

原创 CSS实现元素水平居中

1.用margin: 0 auto实现将父容器设置一个固定宽度width，给居中元素设置margin: 0 auto即可html<div class="content"> <div class="div1"></div> </div>CSS.content{ width: 500px; height:100px; border: 2px solid black; } .div1{

2021-09-15 19:49:50 685

原创 JavaScript中判断数据类型方法总结

typeoftypeof 是一个一元运算符，放在需要判断类型的运算符前，运算符可以是任何类型，例如：var num = 1;console log(typeof num); //numbertypeof返回一个字符串，是判断出运算符的数据类型。typeof的返回值有boolean（布尔值），string（字符串），number（数字），object（对象或数组），function（函数），undefined（未定义）。var num = 1;console.log(typeof num);

2021-09-14 20:18:08 138

原创使用css绘制三角形

将div绘制成三角形在css中，div默认是矩形的，那么如何将一个div绘制成三角形呢？实现原理将div的width和height设置为0，将两对边的边框设置为相同长度且颜色透明，例如border-left:50px solid transparent; border-right:50px solid transparent，最后再将剩下一边的边框设置为有颜色的就可以了，例如border-bottom:100px solid aqua。实现.app{ width: 0;

2021-09-14 15:21:17 975

原创 CSS盒模型

CSS盒子模型仅仅是一个形象的比喻，每一个可见的HTML元素都是一个盒子，一个盒子由外到内可以分成四个部分：margin（外边距）、border（边框）、padding（内边距）以及content（内容）。我们可以发现margin、padding和border都是CSS属性，它们三是用来控制盒子的边距边框，而content就是描述HTML元素的内容，通过width/height属性设置content的宽度和高度。- 内容盒子(W3C盒子)默认盒子模型 W3C盒子使用box-si

2021-09-10 14:55:38 39

原创 CSS选择器

- 标签选择器作用: 根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性格式: 标签名称{ 属性:值; } 注意点: 1.标签选择器选中的是当前界面中所有的标签, 而不能单独选中某一个标签 2.标签选择器无论标签藏得多深都能选中 3.只要是HTML中的标签就可以作为标签选择器(h/a/img/ul/

2021-09-08 18:58:24 55

原创 CSS的引入方式

- 内联样式(行内样式)缺点：样式与结构冗余优点：优先级较高内联样式表就是把css代码直接写在现有的HTML标签中，具体的使用方法如下面所示：<div style="color:red">设置文字的颜色为红色</div>这里要注意：样式的内容写在元素的开始标签里，并且css样式代码要写在style=""双引号中，如果有多条css样式代码设置可以写在一起，中间用分号隔开。多个css样式写在一起的效果如下面所示：<div style="color:red;font-s

2021-09-08 18:55:27 62

原创 Linux操作系统用户管理相关命令

用户相关命令查看当前用户who am i添加用户：$ adduser 用户名$ adduser user1#查看用户信息$ cat /etc/passwd#查看组信息$ cat /etc/group添加组$ addgroup 组名$ addgroup group1#查看组信息$ cat /etc/group新建用户指定组$ adduser --gid 1001 user2#查看用户信息$ cat /etc/passwd#查看组信息$ cat /etc/gro

2021-08-31 14:06:31 93

原创 Linux操作系统介绍与基础命令

1.1.早期介绍Linux起源于一个学生的简单需求。芬兰赫尔辛基大学Linus Torvalds,Linux的作者与主要维护者，在其上大学时所买得起的唯一软件是Minix. Minix是一个类似Unix，被广泛用来辅助教学的简单操作系统。Linus对Minix不是很满意，于是决定自己编写软件。他以学生时代熟悉的Unix作为原型，在一台Intel 386 PC上开始了他的工作。他的进展很快，受工作成绩的鼓舞，他将这项成果通过互连网与其他同学共享，主要用于学术领域。有人看到了这个软件并开始分发。每当出现新

2021-08-31 13:55:56 116

原创 Axure的基本功能

1.Axure介绍Axure RP是一款专业的快速原型设计工具。Axure（发音：Ack-sure），代表美国Axure公司；RP则是Rapid Prototyping（快速原型）的缩写。 Axure RP的使用者主要包括商业分析师、信息架构师、产品经理、IT咨询师、用户体验设计师、交互设计师、UI设计师等，另外，架构师、程序员也在使用Axure。 Axure RP Pro能快速帮助设计者设计出快捷而简便的创建基于网站构架图的带注释页面示意图、操作流程图、以及交互设计，并可自动生成用于演示的网页文件和

2021-08-31 10:43:06 2899

weixin_43499659的博客