- 博客(47)
- 收藏
- 关注
RSS订阅原创 vue2监测光标位置并手动定位到某个位置
在 getCursorPos 方法中，通过 textarea 获取 selectionStart 和 selectionEnd 的值得到光标的起始、结束位置，再通过调用 setSelectionRange 方法将光标的位置标注出来，实现定位。注意，这里使用的是 selectionStart，只能实现选择文本时对光标的监测，但我们可以将选择文本的起始和结束位置设置在同一个定位数值上，则相当于使用了选择文本功能，但却什么都没选，间接实现了定位到具体某个位置的功能。下面是实现光标位置的监测。
2024-03-28 18:25:45
184
原创 JS生成随机字符串的多种方法
使用时调用randomString方法，参数len为返回的随机字符串长度。传参就长度，如果不带参数默认输出32个字符。
2023-09-19 18:25:52
2397
原创 HTML5中video元素事件详解（实时监测当前播放时间）
事件描述loadstart浏览器开始在网上寻找媒体数据progress浏览器正在获取媒体数据suspend浏览器暂停获取媒体数据，但是下载过程并滑正常结束abort浏览器在下载完全部媒体数据之前中止获取媒体数据，但是并不是由错误引起的error获取媒体数据过程中出错emptiedvideo元素或audio元素所在网络突然变为未初始化状态可能原因有两个:1.载入媒体过程中突然发生一个致命错误2.在浏览器正在选择支持的播放格式时，又调用 了load方法重新载入媒体stalled。
2023-03-20 01:38:57
4239
原创 vue 基于vue-lazyload图片懒加载、延迟加载
效果是默认不加载图片，先用一个占位符图来代替，等使用图片的时再进行加载（比如滚动到图片的时候），如果真正的图片请求出错了，用默认的出错图片来进行占位。
2023-03-20 01:20:05
489
原创 Vue2.x 中注册插件
目录下建一个和组件名称一致的文件夹，然后将我们上面定义的 splash.vue 文件放到这个目录下面，然后在这个目录下面再建一个。由于插件更具灵活性，所以我们可以自定义组件注册成全局组件。按照 Vue 的约定，我们需要将我们的项目结构做一下调整。接下来，我们就可以在 任何组件中通过调用 Vue 对象的全局方法或实例方法来控制我们的自定义组件，比如，我们可以在。的文件，通过在这个文件里面写注册代码，将我们的自定义组件注册成插件。在 main.js 中，引入插件。
2023-03-13 12:11:41
143
原创 vue 自定义全局组件 通用流程
index.js文件(上面globalComponents下面统一新建一个index.js文件)loading,mySelect//main.js 批量导入全局自定义组件07vue 自定义全局组件 通用流程。
2023-03-13 11:54:53
384
原创 Vue封装Axios实现全局的loading自动显示效果
在 vue 项目中，我们通常会使用 Axios 库来与后台进行数据交互。而当我们发起 ajax 请求时，常常需要在页面上显示一个加载框（Loading 效果），然后等数据返回后自动将其隐藏。要实现这个功能，我们可以在每次请求前手动显示个加载框，等收到数据后又将其隐藏。但如果每个请求要都这么做，就略显麻烦。下面通过样例演示如何封装一个带 loading 效果的 Axios 组件，它能够对请求和响应进行拦截从而实现 loading 的自动显示与隐藏，并且在请求失败时自动弹出消息提示框显示错误信息。
2023-03-13 11:48:47
2514
1
转载 vue使用 axios添加拦截器，get请求、post 请求头部添加token
vue使用 axios添加拦截器，get请求、post 请求头部添加token
2022-12-24 23:36:26
16995
1
原创 错误 1452：无法添加或更新子行：外键约束失败
#1452 - Cannot add or update a child row: a foreign key constraint fails (`goaread`.`views`, CONSTRAINT `views_ibfk_1` FOREIGN KEY (`source_id`) REFERENCES `blogs` (`id`) ON DELETE CASCADE ON UPDATE CASCADE)
2022-11-19 19:04:24
17869
原创 1366 - Incorrect string value: ‘\xF0\x9F\x98\x80‘ for column问题解决(mysql的emoji表情显示为问号)
mysql的emoji表情显示为问号
2022-09-30 11:23:05
382
转载 为什么使用Stylus
CSS预处理器的出现大大的提高了前端开发的效率和逼格，它让CSS可编程化。LESS和Sass/SCSS是两种最为常见的预处理器，拥有大量的用户基数，数目庞杂的第三方库。然而，还有一种预处理器并未引起足够的重视，Stylus。现在，我们来说说为什么Stylus很棒，为什么使用它，为什么它将会变成你的首选预处理器。
2021-12-24 18:29:43
283
原创 原生 js 获取所有兄弟节点
使用原生 js 获取所有的兄弟节点// 封装成函数function get_Siblings(elem) { let sibArr = [] let allChilds = elem.parentNode.children allChilds.forEach((i, v) => { if (i.nodeType == 1 && i != elem) { sibArr.push(i) }
2021-12-20 08:26:24
2423
原创 js 判断数组中是否包含某个元素
判断数组中是否包含某个元素的八种方法方法一：array.indexOf (item,start)：元素在数组中的位置，如果没与搜索到则返回 -1。参数 描述 item 必须。查找的元素。 start 可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。 实际用法：if (arr.indexOf (某元素) > -1){// 则包含该元素}var f
2021-12-20 08:25:51
3208
原创 瀑布流实现方案探讨
最近在仿小红书时又遇到了一个问题，就是笔记的瀑布流展示。我采用的是张鑫旭在博客中提到的一种基于 css3 新的column-count特性的方案，这种方案本来是我最喜欢的，因为不需要额外的标签嵌套，也没有 js 参与布局，css 写起来也是简洁又优雅。但是在使用 safari 调试页面时发现了一个奇怪的问题，使我最终决定放弃这种方案。最近在仿小红书时又遇到了一个问题，就是笔记的瀑布流展示。我采用的是张鑫旭在博客中提到的一种基于 css3 新的column-count特性的方案，这种方案本...
2021-12-20 08:24:57
355
原创 jQuery 与 Zepto 的异同
Zepto 最初是为移动端开发的库，是 jQuery 的轻量级替代品，因为它的 API 和 jQuery 相似，而文件更小。相同Zepto 最初是为移动端开发的库，是 jQuery 的轻量级替代品，因为它的 API 和 jQuery 相似，而文件更小。Zepto 最大的优势是它的文件大小，只有 8k 多，是目前功能完备的库中最小的一个，尽管不大，Zepto 所提供的工具足以满足开发程序的需要。大多数在 jQuery 中・常用的 API 和方法 Zepto 都有，Zepto 中还有一些 jQuer
2021-12-20 08:22:27
107
转载 利用 Javascript 实现一套自定义事件机制
随着 web 技术发展，使用 JavaScript 自定义对象愈发频繁，让自己创建的对象也有事件机制，通过事件对外通信，能够极大提高开发效率。事件机制为我们的 web 开发提供了极大的方便，使得我们能在任意时候指定在什么操作时做什么操作、执行什么样的代码。前言事件机制为我们的 web 开发提供了极大的方便，使得我们能在任意时候指定在什么操作时做什么操作、执行什么样的代码。如点击事件，用户点击时触发；keydown、keyup 事件，键盘按下、键盘弹起时触发；还有上传控件中，文件加入前事件，上
2021-12-19 22:35:16
209
原创 js 获取 iframe 页面元素
操作 iframe 必须掌握的父子页面关系及常用的操作方法，理解其中的联系。<iframe id="myframe" src='<c:url value="/base/server/report/report.do?REPORT_ID=${param.REPORT_ID}"/>' height="100%" width="100%"></iframe>通过父页面操作子页面获取 iframe 页面中的元素操作 javascript jquery
2021-12-19 22:30:51
18534
原创 js 和 jq 获取兄弟节点、父节点、子节点
js 和 jq 获取兄弟节点、父子节点，以及节点元素等，便于在逻辑中判断二者的区别而进行效果的操作。javascript 实现方式var parent = test.parentNode; // 父节点var chils = test.childNodes; // 全部子节点var first = test.firstChild; // 第一个子节点var last = test.lastChild; // 最后一个子节点 var previous = test.previousSib
2021-12-19 22:29:22
862
转载 hexo 教程之为 hexo 编写一个插件
该教程为我们呈现了 hexo 插件最基础的开发流程，不涉及具体功能。准备工作Hexo 安装完毕，执行完毕 hexo init. 可以本地访问.如果 NPM 有下载问题，请使用 cnpmCNPM另外强烈推荐git bash插件简介很多人不理解为什么要有插件，因为我们已经被浏览器的插件烦透了对吗？ 没错。不受控的插件只会把用户搞疯狂。但是受控的插件，可以锦上添花确定需求插件存在的意义是，一定要解决用户痛点。本文实例只会打印一句 log，很显然没人会用这个插件。新建 pa..
2021-12-19 22:28:37
569
原创 javascript 实现英文首字母大写
实现 javascript 英文首字母大写有多种方法，这里分别介绍了 css 与 js 的实现方式，但主要以 js 为重点。实际开发中，越简单明了越好，css 方式最为直观简单。css 实现方式首先介绍 css 实现的方式。<html> <head> <style> h1 { text-transform: uppercase } p.uppercase { text-transfo
2021-12-19 22:27:01
4406
原创 windows环境下mongodb下载、安装和使用总结
一、首先安装mongodb1.下载地址：Downloads for win322.解压缩到自己想要安装的目录，比如d:\mongodb3.创建文件夹d:\mongodb\data\db、d:\mongodb\data\log，分别用来安装db和日志文件，在log文件夹下创建一个日志文件MongoDB.log，即d:\mongodb\data\log\MongoDB.log4.运行cmd.exe进入dos命令界面，执行下列命令 > cd d:\mongodb\bin >
2021-12-19 22:23:36
234
原创 数组reduce()和reduceRight()方法
很多时候需要累加数组项的得到一个值(比如说求和)。如果你碰到一个类似的问题，你想到的方法是什么呢？会不会和我一样，想到的就是使用for或while循环，对数组进行迭代，依次将他们的值加起来。比如：var arr = [1,2,3,4,5,6];Array.prototype.sum = function (){ var sumResult = 0; for (var i = 0; i < this.length; i++) { sumResult += pars
2021-12-19 22:18:56
136
原创 区分slice、splice、split方法
1.slice（数组）用法：array.slice(start,end)解释：该方法是对数组进行部分截取，并返回一个数组副本；参数start是截取的开始数组索引，end参数等于你要取的最后一个字符的位置值加上1（可选）2.slice（字符串）用法：string.slice(start,end)解释：slice方法复制string的一部分来构造一个新的字符串，用法与参数匀和数组的slice方法一样;end参数等于你要取的最后一个字符的位置值加上13.splice（数组）
2021-12-19 22:16:31
88
原创 new Date() 日期格式处理
var myDate = new Date()myDate.getYear() //获取当前年份(2位) myDate.getFullYear() //获取完整的年份(4位,1970-????) myDate.getMonth() //获取当前月份(0-11,0代表1月),所以获取当前月份是myDate.getMonth()+1 myDate.getDate() //获取当前日(1-31) myDate.getDay() //获取当前星期X(0-6,0代表星期天) myDate.getTim.
2021-12-19 21:56:42
1326
原创 apply()找出数组中最大/小值
let numbers = [5, 12, 3, 9]let max = Math.max.apply(null, numbers)let min = Math.min.apply(null, numbers)console.log(max, min) // 12, 3Math.max.apply(null, numbers) 相当于 Math.max(5, 12, 3, 9)，但使用前者可以指定任意个数的值。详情参考Function.prototype.apply...
2021-07-11 17:00:42
87
原创 怎样获取元素某个具体的样式值？
// html<div class="box"></div>// css.box::after { content: 'yes'}如何获取 .box 伪类的 content 的值？使用 window.getComputedStyle()：let box = document.querySelector('.box')let content = window.getComputedStyle(box, '::after').contentconso.
2021-07-11 15:22:59
55
原创 win10更新时间
1、打开命令提示符（管理员），输入：net stop w32time回车w32tm /unregister回车以上命令的意思是首先关闭时间服务，接着取消注册时间服务。2、再输入：w32tm /register回车net start w32time回车与第四步命令对比可以看出，意义相反，注册时间服务再启动。3、最后输入：w32tm /resync /nowait回车完成网络时间更新的准备。再到日期和时间管理中更新时间。...
2021-07-11 15:15:40
2013
原创 在 git push 时出现提示 OpenSSL SSL_connect 或 OpenSSL SSL_read 类似错误的解决方式
在 git push 时出现提示 OpenSSL SSL_connect 或 OpenSSL SSL_read 类似错误的解决方式在使用 git 推送时出现以下类似问题fatal: unable to access ‘https://github.com/Godread/godread.github.io.git/': OpenSSL SSL_connect: SSL_ERROR_SYSCALL in connection to github.com:443出现类似错误的原因一般是本地与仓库.
2021-07-01 12:22:00
868
原创 一个电脑使用多个github帐号的SSH key
一个电脑上要使用多个github账号上传到不同的仓库时，如何建立SSH Key连接建立不同账号的SSH Key首先创建SSH Key，如下$ ssh-keygen -t rsa -C "[email protected]"如果本地没有ssh的话，一直按enter键，直到不再提示，本地/.ssh文件夹会生成id_rsa和id_rsa.pub两个文件。用编辑器或文本打开id_rsa.pub的内容，添加到github的SSH Key中。其次创建另一个或多个SSH Key，创建命令同上但要.
2021-07-01 12:21:01
315
原创 实现简单的axios异步增删改查功能
手动实现一个简单的 axios 增删改查的功能封装，实现非 rest API 接口的数据请求，数据的模拟用 json-server 来实现预备数据首先，全局安装 json-servernpm install -g json-server在本地建立 db.json 文，并填充数据{ "posts": [ {"id": 1, "title": "json-server", "author": "typicode"}, {"id": 2, "title": "jso.
2021-07-01 12:18:54
2797
原创 两个hexo博客的多端同步管理与push denied问题（亲测有效）
在一个电脑上管理两个或多个hexo博客，在推送和多端同步时会再现一些问题，比如凭证覆盖、远程下载上传等建立不同的 hexo 博客需要不同的 github 账号，创建过程较为简单，比较伤脑筋的首先是多端同步问题。一、hexo博客的多端同步问题在使用 hexo 博客时，通常不会总是在同一台电脑上发文章，可能会在不同的地方有发文章的需求，拷贝既不快又不方便，因此需要源文件同步。博客源文件同步写完文章部署到网站hexo cleanhexo ghexo s // 本地查看效果，可略过.
2021-07-01 12:17:09
408
原创 手写Promise-ES5函数版与ES6_class版
自定义 Promise 的全部逻辑，并加入两个延迟执行的方法一、ES5函数版/** * 自定义 Promise 函数模块: IIFE * */(function(window) { // 将经常使用的字符串用常量代替 const PENDING = 'pending' const RESOLVED = 'resolved' const REJECTED = 'rejected' /** * Promise 构造函数 * e.
2021-07-01 12:11:22
120
原创 解决跨域问题的几个主要方案
跨域就是跨资源请求，域名由协议、子域名、主域名、端口号组成，当其中任意一个不相同时，都算作不同域，不同域之间相互请求资源，即“跨域”。不过，跨域的请求可以正常发送，服务端也可以正常收到请求并返回结果，只是被浏览器拦截了。跨域简介之所在存在跨域，是受到了同源策略的的限制，同源策略要求源相同才能正常通信，以维护资源安全，即要求协议、域名、端口号完全一致。同源策略，就是为了隔离潜在的恶意文件对资源的侵害，它建造了一种保护用户隐私，防止读取 cookie 进行身份伪造等的安全机制。同源策略的限制.
2021-07-01 12:10:03
156
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人