javascript 专栏
关注
分享
扫一扫
文章平均质量分 66
主要介绍原生的javascript的一些基础且重要的知识点，武装自己的头脑
Q_Q 忙里偷闲
自律。
展开
-
js 写一个舒适的渐变背景效果
很久没有写博客了，今天学习看到一个博客网站，停留了一会，被这个效果吸引住了，于是就把这块的代码搬过来了。效果如下：很简单，就是停留一个页面，然后会随机变换背景颜色，下面是效果的GIF图片。原创 2023-05-29 11:02:22 · 1874 阅读 · 0 评论 -
Uncaught (in promise)报错解决
cart.html:1 Uncaught (in promise) {request: {…}, data: {…}, status: 0, statusText: “”, headers: “”, …}解决方案：跨域问题我的是用浏览器…这种方式无效，虽然能加载出来文件但是还是会报 Uncaught (in promise) 的错，然后开phpStudy 用loclahost的地址访问页面就...原创 2019-01-27 01:11:00 · 55485 阅读 · 0 评论 -
js 将一维数组转化为二维数组
JS 将一维数组转换为二维数组原创 2022-10-11 15:54:58 · 1446 阅读 · 0 评论 -
js 通过ajax实现图片上传并预览并提交到服务器（方式一）
JavaScript实现图片上传并预览并提交ajax实现效果实现步骤HTML代码JS代码node.js 服务端代码实现效果实现步骤先有一个文件域，用于选择文件使用文件域的change事件 在文件选择发生变化的时候去获取文件对象文件本身不能直接传递 使用formdata对象传递使用ajax 请求 和之前post请求一样 传递一个参数data值就是当前formdata还需要3个必须的...原创 2019-02-16 20:14:13 · 11251 阅读 · 1 评论 -
js 递归遍历json数组并层级显示级联菜单
1. 先定义一个数组结构(一般是后端返回的结构)id：主键IDpid：父类id（所属的父级ID）var treeData = [ { id: 1, name: '第一级数据1', sex: 1, pid: -1 }, { id: 2, name: '第一级数据2', sex: 2, pid: -1 }, { id: 3, name: '第二级数据1', sex: 2, pi...原创 2019-11-29 16:32:59 · 3119 阅读 · 1 评论 -
js 解决按下Backspace键跳转到上一个页面问题
今天在IE浏览器下发现，当把使用属性将文本框设置成只读时有一个奇怪的问题：如果光标进入只读文本框，然后按下Backspace键，就会跳转到上一个页面，效果就像点击了浏览器的后退按钮返回前一个页面一样，而在火狐和google下没有这样的问题出现，为了解决这个问题，写了一个如下的处理方法，如果文本框是只读的，那么就。原创 2017-06-27 16:46:49 · 5476 阅读 · 1 评论 -
js 数组对象中根据相同的name值对id进行 数组形式合并
数组对象相同的key值合并，并且把对应的ID放到一个数组通过一个数组根据项目名称相同的，把下面的ID组合到一个数组中let list = [ { name: '项目1', id: 1, age: 11 }, { name: '项目2', id: 2, age: 22 }, { name: '项目3', id: 3, age: 33 }, { name: '项目1', id: 4, age: 44 }, { name: '项目2原创 2021-06-11 10:38:43 · 4234 阅读 · 7 评论 -
js 函数节流和函数防抖及区别详解
浏览器中总是有一些操作非常耗费性能。所以就有了函数节流和函数防抖来提高浏览器性能。函数节流：频繁触发一个事件时候，每隔一段时间，函数只会执行一次。函数防抖：当触发一个时间后的n秒内，如果该事件没有被第二次触发，则执行。否，则重新开始计时。不论是函数防抖还是函数节流，都是性能优化的一种手段，都是为阻止函数无意义的执行，减小dom压力，避免不必要的性能浪费。以上是封装好的防抖，节流函数。大家可自取。原创 2024-04-20 20:33:25 · 657 阅读 · 0 评论 -
ajax轮询 websocket SEE 实现实时消息推送与优缺点详解
在很久很久以前，前端一般使用轮询来进行服务端向客户端进行消息的伪推送，为什么说轮询是伪推送？因为轮询本质上还是通过客户端向服务端发起一个单项传输的请求，服务端对这个请求做出响应而已。通过不断的请求来实现服务端向客户端推送数据的错觉。并不是服务端主动向客户端推送数据。显然，轮询一定是上述三个方法里最下策的决定。首先轮询需要不断的发起请求，每一个请求都需要经过http建立连接的流程（比如三次握手，四次挥手），是没有必要的消耗。客户端需要从页面被打开的那一刻开始就一直处理请求。原创 2024-04-20 20:12:58 · 1419 阅读 · 0 评论 -
js事件循环机制（event loop）宏任务 微任务详解
用简单的流程解释事件循环。在了解什么是事件循环之前我们需要先行了解 javascript是一个单线程语言 和 javascript的事件分类。原创 2024-04-20 11:25:31 · 1005 阅读 · 0 评论 -
js try catch用法详解 异常处理 异步捕获
这2段代码try，catch都不会捕获到错误信息，因为promise内部的错误不会冒泡出来，而是被 promise 吃掉了，只有通过。catch 包裹了计划要执行的函数，该函数有延迟，这时js引擎已经离开了 try…为了捕获到计划的函数中的异常，那么 try…能工作，代码必须是可执行的。块中的语句执行完毕，或者没有发生任何错误try块中的语句执行完毕，最后将执行。块中的语句首先被执行。try语句包含了由一个或者多个语句组成的try块，和至少一个。块中语句，其中括号中的err参数被作为例外变量传递。原创 2024-04-19 17:51:04 · 6663 阅读 · 1 评论 -
js兼容ie浏览器日期格式化的aN:aN:aN问题
测试小姐姐提了一个这个bug…心累，之前写的日期格式化问题没有兼容ie，ie这个小婊砸，于是就写了一个ie兼容的方法先看图（吐槽一下：我为什么喜欢先配图。。。我经常有时候在网上百度谷歌问题时候，没有配图，就是一堆代码，也不知道是不是自己想要的结果，后来改了一堆，发现特么的什么鬼，浪费我时间，所有我会尽量先配图，如果不是你想要的结果就不要浪费时间往下看）1. filters 文件夹index...原创 2019-09-07 11:02:17 · 2281 阅读 · 1 评论 -
JS使用for循环实现异步方法同步执行调用接口，判断执行完
需求：点击保存的时候使用for循环批量调用新增接口。要求必须是同步插入，不能异步插入。1. 下面是新增页面2. 可以看请求，确实是同步执行3次结果。3. 代码（核心）// 保存按钮async saveToolClick() { this.loading = true; for (let i = 0; i < this.defaultTableToolData.length; i++) { this.addToolForm.toolName = this.defaultTab原创 2020-09-08 14:48:59 · 16898 阅读 · 1 评论 -
原生JS实现视频播放功能
准备工作:一个视频文件一份字体图标文件缓冲加载的GIF图标效果如图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>制作视频播放</title> <!--引入字体图片--> &l...原创 2019-04-15 16:32:39 · 19105 阅读 · 0 评论 -
js全屏事件fullscreenchange，进入全屏，退出全屏操作
1.进入全屏function launchFullscreen(element) { if (element.requestFullscreen) { element.requestFullscreen() } else if (element.mozRequestFullScreen) { element.mozRequestFullScreen() } else ...原创 2019-06-26 11:32:50 · 18250 阅读 · 4 评论 -
彻底搞懂浅拷贝与深拷贝区别
1. 前言此篇文章中也会简单阐述到栈堆，基本数据类型与引用数据类型，因为这些概念能更好的让你理解深拷贝与浅拷贝。原文地址：https://www.cnblogs.com/echolun/p/7889848.html更多参考 ：js面试题：实现对象深度克隆（deepClone）的三种方案2. 什么是浅拷贝与深拷贝？如何区分深拷贝与浅拷贝，简单点来说，就是假设B复制了A，当修改A时，看B...原创 2019-03-16 21:01:23 · 5571 阅读 · 2 评论 -
JS的网络状态以及强网弱网详解
是 Web API 中提供的一种获取网络连接相关信息的接口。该接口返回的是一个 NetworkInformation 对象，包含了多个关于用户设备网络连接状况的属性，如网络类型、带宽、往返时间等。通过当前网络连接的估计下行速度（单位为 Mbps）设备网络连接最大可能下行速度（单位为 Mbps）当前网络连接的估计速度类型（如 slow-2g、2g、3g、4g 等）当前网络连接的估计往返时间（单位为毫秒）是否处于数据节省模式除此之外，还有其他诸如typeonchange。原创 2023-09-19 16:21:09 · 2702 阅读 · 1 评论 -
ajax详细讲解
使用 Ajax 技术，可以通过 JavaScript 和 XMLHttpRequest 对象来向服务器获取数据。在 Ajax 请求的过程中，可以通过定义回调函数来对请求的结果进行处理，回调函数会在请求完成后执行，通过这种方式可以更新页面内容或者响应用户操作。原创 2023-07-26 10:40:01 · 1025 阅读 · 0 评论 -
fetch详细讲解
使用 fetch 可以方便地向服务器发送请求，并将响应返回给客户端。你可以使用 fetch 获取文本、JSON、图像和文件等数据，并进行各种处理。fetch 还支持流式传输和取消请求等高级功能，使得处理大型数据集和长时间运行的操作变得更加简单和可靠。fetch API 也是 Javascript 中常用的 API 之一，它提供了一组方法和属性，可以在浏览器端与服务器进行通信。通过 fetch API，你可以轻松地使用 fetch 协议进行数据传输，并对请求和响应进行操作和处理。原创 2023-07-28 13:44:14 · 15976 阅读 · 0 评论