小小的少年

原创 初始化样式简单版

在项目中经常使用css初始化，下面的是简单的初始化样式html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, c

原创 一行 CSS 实现 10 种现代布局

现代 CSS 布局使开发人员只需按几下键就可以编写十分有意义且强大的样式规则。上面的讨论和接下来的帖文研究了 10 种强大的 CSS 布局，它们实现了一些非凡的工作。01. 超级居中：place-items: center对于第一个“单行”布局，让我们解决所有 CSS 领域中最大的谜团：居中。我想让您知道，使用 place-items: center 会让此操作比您想象的容易。首先指定 grid 作为 display 方法，然后在同一个元素上写入 place-items: center。place-

转载 34个不可错过的JavaScript代码优化技巧

1、 带有多个条件的 if 语句把多个值放在一个数组中，然后调用数组的 includes 方法。//longhandif (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') { //logic}//shorthandif (['abc', 'def', 'ghi', 'jkl'].includes(x)) { //logic}2、简化 if true…else对于不包含大逻辑的 if-else 条件，可以使用

原创 图片上传到后端

图片能够上传到服务器之外还可以上传到阿里云的OSS对象存储、腾讯的对象存储以及七牛云。上传到七牛云需要先进行注册七牛云并创建存储空间，在七牛云的密钥管理中心获取到AK和SK以及空间存储名用于生成token在七牛云的开发者中心下载/安装相应的SDK，用于生成token。php生成七牛token由于我使用的是纯php，因此只能是下载php SDK并在php文件中进行引入。在七中下载php SDK到本地，下载之后将整个文件夹放到自己项目相应的位置，在需要商城token的文件中进行导入，当如方式与七牛官网

原创 wangeditor使用方法，上传图片/视频到七牛云

官方首页：https://www.wangeditor.com/官方文档：https://www.wangeditor.com/doc/基本使用使用方式下载可以使用npm安装也可以使用CDN进行连接npm 安装 npm i wangeditor --saveCDN 链接 https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js使用CDN js 外链引入<div id="div1"> &l

原创 wangeditor粘贴文本+图片实现图片上传功能

wangeditor富文本实现文本+图片混合将图片上传到七牛云

原创 在Javascript中什么是伪数组？如何将伪数组转化为标准数组？

什么是伪数组？伪数组无法直接调用数组的常用方法，但是可以使用遍历方法。伪数组到的符合以下条件：具有商都length按照索引进行排列不能够使用数组的常用方法将伪数组设置成真实数组1、通过遍历的方式创建一个空数组，循环遍历伪数组，将遍历出的数据逐一放在空数组中var ali = document.getElementsByTagName('li');console.log(ali); // [li, li, li, li]ali.push("hello"); /

转载 JS实现数组去重方法总结

方法一：双层循环，外层循环元素，内层循环时比较值如果有相同的值则跳过，不相同则push进数组Array.prototype.distinct = function(){ var arr = this, result = [], i, j, len = arr.length; for(i = 0; i < len; i++){ for(j = i + 1; j < len; j++){ if(arr[i] === arr[j]){ j = ++i;

原创 节点操作

创建节点1. document.createElement()2. document.cretaeTextNode()插入节点1. 父节点.appendChild(子节点)2. 父节点.insertBefore(子节点, 谁的前面)删除节点1. 父节点.removeChild(子节点)2. 节点.remove()替换节点1. 父节点.replaceChild(新节点, 旧节点)克隆节点1. 节点.cloneNode()=> 参数默认为 false, 表示不克隆后代节点=&g

原创 事件委托

就是利用事件传播的机制, 把自己的事件委托给别人来做把子元素本身需要绑定的事件, 直接绑定给共同的父元素在父元素的事件里面通过事件目标来判断你点击的是谁事件委托相比于循环绑定事件的优点对于 DOM 操作的减少动态添加的元素不需要单独添加事件整套的替换元素, 不影响操作, 是要把事件委托委托给一个在页面上不动的父元素var ul = document.querySelector('.box')ul.onclick = function (e) { e = e||

原创 闭包

闭包函数是一个不会销毁的函数，内部函数可以使用外部函数的私有作用域。闭包的特点:延长了变量的声明周期缺点: 一个不会销毁的函数执行空间函数内部的变量私有化 缺点: 外部不能访问, 如果你希望访问, 那么需要闭包函数的出现可以在函数外部操作函数内部的私有数据缺点: 需要一个闭包函数的出现柯理化函数是闭包函数的高阶应用...

原创 js中继承的方法

拷贝继承、原型继承、构造函数继承、寄生式组合继承、类继承语法继承让 A 构造函数的实例使用 B 构造函数的属性和方法我们 A 继承自 B 构造函数A 是 B 的子类B 是 A 的父类原型继承利用修改原型链的方式来达到继承的效果原型集成的优点和缺点优点: 属性和方法都继承下来的缺点:在做 Student 的实例, 一个构造函数需要在两个位置传递参数我继承来的属性, 不在自己身上// 传感两个函数，分别是f函数和son函数 function f(name){

原创 call、apply和bind的区别

1、都是用来改变函数的this对象的指向的。2、第一个参数都是this要指向的对象。3、都可以利用后续参数传参。4、bind会产生新的函数，（把对象和函数绑定死后，产生新的函数）。call和apply不会产生新的函数，只是在调用时，绑定一下而已。5、call、apply会立即执行，bind返回的是一个函数，需调用后执行6、call后面是传递的参数，apply的第二个参数是一个数据，是传输的数据。使用场景：1、需要改变某个函数的this指向时2、当参数较少时可以使用call，参数较多可以使用a

转载 IE和标准下有哪些JS兼容性的写法

原创 CSS选择符有那些？那些属性可以继承？优先级算法如何计算？CSS新增伪类有哪些？

CSS选择器id选择器类选择器（class选择器）属性选择器子代选择器后代选择器通配符选择器属性选择器伪类选择器可以继承的属性1、字体系列属性font：组合字体font-family：规定元素的字体系列font-weight：设置字体的粗细font-size：设置字体的尺寸font-style：定义字体的风格font-variant：设置小型大写字母的字体显示文本，这意味着所有的小写字母均会被转换为大写，但是所有使用小型大写字体的字母与其余文本相比，其字体尺寸更小。f