- 博客(19)
- 收藏
- 关注
RSS订阅原创 Vue笔记 one（常用指令、双向绑定）
VUE ONE STUDY????概述01 - Vue基本模板02 - 数据单向绑定03 - Vue数据双向绑定04 - 常用指令v-once05 - 常用指令v-cloak06 - 常用指令v-text 和 v-html07 - 常用指令v-if v-else-if v-else08 - 常用指令v-show09 - 常用指令v-for10 - 常用指令v-bind11 - 常用指令绑定类名12 - 常用指令绑定样式13 - 常用指令 v-on14 - 常用指令 v-on 修饰符15 - 常用指令 v-o
2021-09-30 00:28:08
651
原创 发布订阅者模式（详细比喻）
✨SyncHook????简要一：????了解发布订阅者模式????二：????实现发布订阅者模式???? 2.1：定义一个发布者2.2：????给发布者添加功能????2.3：????使用发布订阅者模式????2.4：????发布订阅者优化????简要在学习这篇文章中，你可以学到发布订阅者模式????是什么？怎么实现发布订阅者模式????？预备基础：javascript????一：????了解发布订阅者模式????什么是发布订阅者模式????？例：你去买货断货了，你要跟老板预定货物，你
2021-09-27 17:31:59
457
原创 js实现星空背景（附加 + 获取网页高宽兼容封装）
Starry Bgc????????????????????????展示效果搭建基本结构添加动画编写 JS 代码实现网页兼容高宽封装创建 星星 以及 位置随机编写星星大小 以及 显示和隐藏页面的 变化 星星 随之改变完整代码星空背景:Math 内置对象设置星星的随机位置，onresize 事件来提高用户效果，CSS hover 选择器来进行交互效果。展示效果搭建基本结构CSS 样式span { width: 30px; height: 30px; background: ur
2021-08-23 17:40:17
764
原创 javascript中Promise封装（进阶）
手撕Promise???????????????????????? 文件结构 以及 方法了解 ????????01 - 搭建基本结构 ????????????????????????02 - Promise中 resolve 和 reject 结构 ????03 - Promise中 then 方法 ???????????????????????????? 文件结构 以及 方法了解 ???????????? index.html???? promise.js接下来我们将封装
2021-08-21 18:14:58
877
原创 原生JS实现日历（附带源码）
Calendar???? 效果展示 ???????? 展示地址 ???? 源代碼 ???????? 效果展示 ???????? 展示地址 ???? 源代碼 ????展示地址：http://xiaomi.3vhost.net。源代碼：https://github.com/Xiaomi-tx/xiaoMi-Calendar。
2021-08-16 14:55:20
367
原创 javascript中类的public,protected,private详解
类???????? START???????? 01 - PUBLIC???????? 02 - PROTECTED???????? 03 - PRIVATEHAPPY???????????????????? START在我们 javascript ES5 之前要想进行继承，封装，多态性，得使用到我们的原型，原型链来使用面向对象的过程，但是 ES6 之后新增了一个 class 语法，可以看做是 “语法糖”，实质还是运用了 ES5 的原型，和原型链进行实现的。???????? 01 - PUBLIC
2021-08-05 00:02:48
4347
原创 JS中使用reduce函数配合css3动画实现超好看的文字效果
????Text Result.????效果展示???????? 第 1 步 - 搭建基本结构???? 第 2 步 - 使用 js 包裹每一个文字???? 第 3 步 - 给每一个 span 绑定 mouseenter 事件???? 第 4 步 - 编写 CSS 代码让他动起来???????? 最后一步 - 添加 animationend 事件。完整代码 - ????大家好我是智障 人称“吴签”接下来给大家带来的是一个 非常炫酷的文字效果???? 里面使用了javascript的函数reduc
2021-07-29 12:42:35
1000
3
原创 详细介绍 cookie 和 cookie的添加、查找、删除封装。
文章目录开篇01 - cookie 的作用 ????02 - cookie 的生命周期 ????03 - cookie 的作用范围 ????04 - Tips ????05 - 获取数据 ????06 - 存储数据 ????07 - 设置生命周期 ????08 - 设置路径 ☕09 - 设置域名 ????10 - 添加 cookie 封装 ????11 - 查找 cookie 封装 ????12 - 删除 cookie 封装 ????开篇Cookie，有时也用其复数形式 Cookies。类型为“小型文
2021-07-26 14:21:22
269
原创 构建jQuery框架封装 nextAll 和 prevAll 方法！！！！（超级篇！）
文章目录闲话????第一步：构建一个自己的 jQuery????第二步：编写一些基本结构????第三步：编写 nextAll 方法????????第四步：编写 prveAll 方法????完结闲话????最近在弄 jquery 源码，感觉真的对自己的提升有很大的进步，在jquery框架中也就使用到了原型和原型链，还有闭包的概念，然后各种的思想，什么链式编程，还有extend这个方法非常的nice，然后接下来，我会带着大家写一下，jquery 中的 nextAll 和 prevAll 这两个函数????
2021-07-26 01:03:05
891
4
原创 javascript中数组方法map、some、every、filter的封装。
文章目录开篇一：map????的封装二：filter????的封装三：some????的封装四：every????的封装开篇在Javascript中，我们要对数组操作，可以用到很多已经封装好的函数进行使用比如： map、filter、some、every。Map当我们要修改数组中一些数据的时候，可以使用map方法来修改。方法介绍：该方法可以改变原来数组里面的内容。问题：将 [‘????’,‘????’,‘????’,‘????’,‘????’,‘????’] 添加价格。答案：[
2021-07-09 15:48:17
1001
原创 前端瀑布流使用原生JS实现（超详细！）
文章目录前言一：效果展示二：HTML 部分三：CSS 部分四：JS 部分完整代码前言今天记录一下，前端使用原生JS来实现瀑布流布局，其实在CSS3中新出了两个属性分别是：columns 和 column-gap 这两个值可以实现瀑布流布局，但是兼容性不强，而且也是别人已经写好的，感觉使用意义不大，接下来我们自己来实现一个瀑布流布局。一：效果展示二：HTML 部分搭建基本结构，里面每一个div对应着一个图片。<!DOCTYPE html><html lang="en"
2021-07-06 17:07:33
212
原创 Markdown 0基础详细讲解
文章目录一：Markdown 超级好用！二：入门（标题）一级标题二级标题三级标题三：入门（无序列表）四：入门（有序列表）五：入门（引用）六：入门（表格）七：入门（图片）八：入门（链接）九：入门（加粗\斜体\删除线\加粗+倾斜）十：入门（TOC标题）十一：入门（代码块）一：Markdown 超级好用！Markdown 是一种轻量级标记语言，它允许人们使用易读易写的纯文本格式编写文档。Markdown 语言在 2004 由约翰·格鲁伯（英语：John Gruber）创建。Markdown 编
2021-07-03 00:01:47
287
原创 关于给每一个元素绑定事件获取索引值的一个点（超详细讲解）
当我们要循环绑定一个事件的时候，我们都会出现问题，就是i的索引值是不对的，如果大家有疑惑可以进行看我下面的代码和执行结果。文章目录解决方法！！一： 使用IIFE立即执行函数通过传值 解决二： 使用 let 有块级作用域 解决三： 使用 事件对象 中的 target 属性 解决四： 给 li 存储一个值 解决HTML<ul> <li>1</li> <li>2</li> <li>3</li> .
2021-06-26 12:49:24
267
5
原创 超详细Javascript笔记（1）持续更新中....
Javascript笔记（1）文章目录Javascript笔记（1）一：简介二：《script》标签注释一：简介1. 概述：javascript (JS) 是一种具有函数优秀轻量级，解释型或即时编译型的编程语言。随着 Web 日益流行，对客户端脚本语言的需求越来越强烈，当时，大多数的用户使用的 28.8kbit/s 的调制解调器上网，但网页变得越来越大、越来越复杂。为了验证简单的表单而需要大量的与服务器进行往返通信成为用户的痛点，想象一下，你填完表单，当你发送到服务器端30秒后给你发送回来一句“
2021-06-23 00:26:26
112
1
原创 使用JS！封装includes函数（超详细！）
在ES6中，我们JS做出了很大的改变，其中有一个函数是includes，可以用来判断字符串或者数组中是否包含所对应的内容，在ES5之前有一个方法是indexOf不过这个方法返回值是索引号如果没有找到则返回-1，这样使得我们很麻烦，在ES6进行了整改，出现了！！！！！includes函数废话不多说，看看indexOf和includes的区别！问题：定义了一个变量 str 值为 ‘abcabczx’ 我们需要把里面重复的去掉放到一个新的变量中，你该如何做？// 第一种方法使用 indexOfv.
2021-06-22 23:33:03
1843
原创 使用JS！！制作一个渐隐轮播图（超详细）！！
渐隐轮播图制作大家可以看到在小米官网上面的轮播图，非常的精美，好看，接下来，我们可以试着自己来做一个精美的渐隐轮播图。编辑器：Vscode相关知识点：动态生成小圆点，改变图片透明度，运用构造函数进行封装。第一步：编写HTML基本结构<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible
2021-06-21 20:32:58
568
原创 弹性布局flex！！之精美聊天框案例（舔狗日记）！！
霸道总裁之得不到则毁掉！该案例大量使用flex布局，提高自己flex布局的熟练度，本人运用VScode进行开发。你做完次案例将学到运用CSS绘画三角形。flex布局：justify-content，align-items，order，flex。做一个舔狗~。建立一个html文件编写HTML代码<!-- 大盒子 --><!DOCTYPE html><html lang="en"><head> <met
2021-06-20 22:38:04
968
1
原创 超详细！！最好用弹性布局flex之运用！
一、flex布局是什么？Flex 布局是 Flexible Box 的缩写，意味着“弹性布局”，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。-- CSS部分.demo { display:flex;}-- HTML部分<div class="demo"></div>行内元素也能设置 Flex 布局。-- CSS部分.demo { display:inline-flex;}-- HTML部分<span class
2021-06-19 21:34:25
263
5
原创 js移动端实现拖拽div效果
移动端实现拖拽效果原理：先获取手指在DOM元素中的距离利用（e.targetTouches[0]）.pageX （e.targetTouches[0]）.pageY再利用手指滑动距离 - 在触摸手指距离就成了盒子移动距离了。再利用盒子本身的距离 + 手指移动距离就能实现拖拽效果啦！...
2021-04-19 20:00:45
540
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人