全部文章
共 1299 篇文章
详解FormData 、Blob、File、FileReader、ArrayBuffer、URL、URLSearchParams对象
一. FormData 利用 ,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的 方法来异步的提交这个"表单".比起普通的ajax,使用 的最大优点就是我们可以异步上传一个二进制文件. 方法： 根据已有form表单初始化一个formData对象： 发送一个二进制数据流： 二. Blob 一个Blob对象就是一个包含有只读原始数据的类文件对象。Blob对象中的数据并不一定得是J...
2种纯前端换肤方案
换肤功能是一项普遍的需求，尤其是在夜晚，用户更倾向于使用暗黑模式。在我负责的公司项目中，每个项目都有换肤功能的需求。 过去，我主要使用 SCSS 变量，并利用其提供的函数，如 、 来实现换肤功能。但因其使用成本高，只能适用于SCSS项目，于是后来我改用 CSS 变量来实现换肤。这样无论是基于 LESS 的 React 项目，还是基于 SCSS 的 Vue 项目，都能应用换肤功能。并且使用时只需调用 函数，降低了使用成本。 Demo地址：...
一文带你弄懂 前端SEO优化
前言 以前开发独立站，涉及过一些SEO的内容，为了避免后面会遗忘，感觉有必要记录下相关经验，也算是一次总结吧！ SEO概念 SEO 是 Search Engine Optimizatio（搜索引擎优化） 的首字母缩写，利用搜索引擎的规则对网站进行内部及外部的调整优化，提高网页或网站在搜索引擎中关键词的自然排名, 以求得获得更多的展现量和吸引免费的点击流量，从而达到互联网营销及品牌建设的目标。 SEO的方式 1\. Title标签 对页面...
一文带你深入理解 JavaScript 中的原型与原型链
先使用构造函数创建一个对象： 在上述例子中，我们使用构造函数 ，通过 创建了一个实例对象 。 原型 上的方法是给实例对象使用的。 每个函数（ 只有函数才会有 ）都有一个 属性，其指向一个对象，这个对象就是该构造函数创建的 实例对象 的原型（通过 指向，后续会详细讲解）。 指向的通常是一个 空对象，我们可以手动为其添加属性和方法，例如： 构造函数的 属性和 实例对象的原型 的关系为： prototype 构造函数...
理解amd,cmd,commonjs,esm,umd 模块化
什么是模块 将一个复杂的程序依据一定的规则(规范)封装成几个块(文件)，并进行组合在一起； 块的内部数据与实现是私有的, 只是向外部暴露一些接口(方法)与外部其它模块通信； 模块化的进化过程 1.全局function模式 将不同的功能封装成不同的全局函数 编码：将不同的功能封装成不同的全局函数 问题：污染全局命名空间, 容易引起命名冲突或数据不安全，而且模块成员之间看不出直接关系 2.namespace模式 简单对象封装 作用：减少了全...
🌟前端使用Lottie实现炫酷的开关效果🌟
前言 在平时的开发过程中，前端或多或少都会遇到实现动画效果的场景。手写动画是一件相当麻烦的事情，调来调去不仅费时费力，可能还会被产品/UI吐槽：这动画效果也不难呀，为什么就不能实现呢？/为什么就没有还原成我想要的样子呢。 比如说产品让我们实现这样的一个开关动效 今天我们就用动画的实现方式—— ，来百分百还原设计师的动画效果，并且可以大大提高我们的工作效率（摸鱼时间）。 简介 首先我们先来看一下，平时我们实现动画都有哪些方式，它们分别有什...
ECharts柱状图相关功能点
highlight: a11y dark theme: cyanosis 记录一下在公司遇到的一些功能，以及相关实现 经过之前环形图需求，对ECharts的使用感觉已经非常熟练了，这次写柱状图的时候就快了很多。 在这里还是力推一下这个ECharts图表集，大部分的灵感都来自于这 ^ ^ 等会讲具体功能的时候，也会将一些具体的案例提供给大家 柱状样式 首先，我给大家提供一种柱状图样式，个人感觉不错，而且实现也很简单 看着很酷，实现也很简单...
Flutter切换源
国内镜像列表 | 提供商 | PUB\ HOSTED\ URL | FLUTTER\ STORAGE\ BASE URL | | | | | | 上海交大 | | | | 清华大学 | | | | OpenTUNA | | | | CNNIC | | | | Flutter中国（七牛云） | | | | 腾讯云 | | | FLUTTER\ GIT\ URL 切换源 Linux 向Bash的配置文件追加配置 使配置生效 macOS 向Z...
js控制一次只加载一张图片
今天看到一个面试题，是关于img图片加载方面的，有必要记录一下。其实关于这个问题，只要知道图片什么时候加载完成就能解决了。 通过onload事件判断Img标签加载完成 实现逻辑：新建一个Image对象实例，为实例对象设置src属性等，在onload事件中添加此实例对象到父元素中，然后将图片地址数组中的第一个元素剔除，继续调用此方法直到存储图片地址的数组为空。 代码 实现效果 加上 后，看到的效果更加明显,我这里加了500毫秒的延迟(录屏...