CodePen 的国内替代「笔.COOL」，一个功能完备、使用便捷的在线HTML/CSS/JS编辑器和作品分享平台
笔.COOL 提供了一个功能完备、使用便捷的在线HTML代码编辑和作品分享平台，无论是为了展示你的前端作品、复现 BUG，还是学习其他人的代码，笔.COOL 都是一个非常好的选择。无论你是初入前端的新手还是经验丰富的老鸟，都能在这里找到属于自己的乐趣和价值。 ...
浅谈Vue.js与原生开发
在现代的Web开发中，前端框架的选择是至关重要的。Vue.js作为一款流行的前端框架，与传统的原生开发相比，有许多明显的区别。 模版语法与HTML Vue.js使用特殊的模板语法来创建动态视图，这样开发者可以更方便地表达复杂的逻辑。通过指令（例如v-if、v-for等）和模板表达式，Vue.js简化 ...
给页面加一个遮罩css代码
原版css,他这个需要用到转换工具： body::before{content:"\7f51\7ad9\5347\7ea7\4e2d\ff0c\656c\8bf7\671f\5f85\3002";position:fixed;bottom:2%;left:6%;z-index:99999;width ...
Vue项目中有封装过axios吗？主要是封装哪方面的？
一、axios是什么 axios 是一个轻量的 HTTP客户端 基于 XMLHttpRequest 服务来执行 HTTP 请求，支持丰富的配置，支持 Promise，支持浏览器端和 Node.js 端。自Vue2.0起，尤大宣布取消对 vue-resource 的官方推荐，转而推荐 axios。现在 ...
2024高频前端面试题合集(一)
1、请简述Js Bridge JavaScript Bridge 是一种技术，用于在不同的编程语言或环境中传递数据和调用函数。在 Web 开发中，JavaScript Bridge 通常指在 JavaScript 和其他语言（如 Java、Objective-C、Swift 等）之间建立通信的机制。 ...
【动画进阶】极具创意的鼠标交互动画
最近，群里在讨论这么一个有趣的交互效果，来源于：vueflow.dev： 通过审查元素，发现原效果借助了 Canvas 实现。 思索了一番，觉得这个效果利用 CSS 配合部分 Javascript 代码完全也是可以做到的。 于是动手尝试了一番，最终完美的复刻了该效果： 过程中还是有非常多有意思的技巧 ...
深入探索JavaScript中的structuredClone：现代深拷贝的解密指南
在 JavaScript 中，实现深拷贝的方式有很多种，每种方式都有其优点和缺点。今天介绍一种原生 JavaScript 提供的structuredClone实现深拷贝。 下面列举一些常见的方式，以及它们的代码示例和优缺点： 1. 使用 JSON.parse(JSON.stringify(obj)) ...
XML Schema（XSD）详解：定义 XML 文档结构合法性的完整指南
XML Schema描述了 XML 文档的结构。XML Schema语言也称为 XML Schema Definition（XSD）。 <?xml version="1.0"?> <xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema"> <xs: ...
一款摸鱼神器！帮助你利用上班时间背单词！
Qwerty Learner —— 一款为键盘工作者设计的单词记忆与英语肌肉记忆锻炼软件，主要服务于以英语作为主要工作语言的键盘工作者。 ...
页面嵌套，界面套娃，除了用iframe，还有其他方式吗？
UIOTOS可以了解下，uiotos.net，通过连线来代替脚本逻辑开发，复杂的交互界面，通过页面嵌套轻松解决，是个很新颖的思路，前端零代码！ 蓝图连线尤其是独创的页面嵌套和属性继承技术，好家伙相当于把vue的组件化、增量式面向对象开发，直接搬到前端拖拽工具上，无代码编程了。 总的来说，这上面的 ...
如何判断一个js对象是否存在循环引用
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 一、背景 在前端JSON.stringfy是我们常用的一个方法，可以将一个对象序列化。 例如将如下对象序列化 const person = { name: 'kalory', age:18} JSON.stringfy(person) / ...
说说你对盒子模型的理解?
一、是什么 当对一个文档进行布局（layout）的时候，浏览器的渲染引擎会根据标准之一的 CSS 基础框盒模型（CSS basic box model），将所有元素表示为一个个矩形的盒子（box） 一个盒子由四个部分组成：content、padding、border、margin content，即 ...
十分钟，带你了解 Vue3 的新写法
本文的目的，是为了让已经有 Vue2 开发经验的 人 ，快速掌握 Vue3 的写法。 因此， 本篇假定你已经掌握 Vue 的核心内容 ，只为你介绍编写 Vue3 代码，需要了解的内容。 一、Vue3 里 script 的三种写法 首先，Vue3 新增了一个叫做组合式 api 的东西，英文名叫 Com ...
Vue3 除了 keep-alive，还有哪些页面缓存的实现方案
引言 有这么一个需求：列表页进入详情页后，切换回列表页，需要对列表页进行缓存，如果从首页进入列表页，就要重新加载列表页。 对于这个需求，我的第一个想法就是使用keep-alive来缓存列表页，列表和详情页切换时，列表页会被缓存；从首页进入列表页时，就重置列表页数据并重新获取新数据来达到列表页重新加载 ...
【动画进阶】巧用 CSS/SVG 实现复杂线条光效动画
最近，群里在讨论一个很有意思的线条动画效果，效果大致如下： 简单而言，就是线条沿着不规则路径的行进动画，其中的线条动画可以理解为是特殊的光效。 本文，我们将一起探索，看看在不使用 JavaScript/Canvas 的基础上，使用纯 CSS/SVG 的方式，我们可以如何大致的还原上述的线条动画效果。 ...
vue3早已具备抛弃虚拟DOM的能力了
前言 jquery时代更新视图是直接对DOM进行操作，缺点是频繁操作真实 DOM，性能差。react和vue时代引入了虚拟DOM，更新视图是对新旧虚拟DOM树进行一层层的遍历比较，然后找出需要更新的DOM节点进行更新。这样做的缺点就是如果DOM树很复杂，在进行新旧DOM树比较的时候性能就比较差了。那 ...
HTML页面关于高分屏的设置
记录一个HTML页面关于高分屏的踩到的坑。 所谓高分屏，就是在同样大小的屏幕面积上显示更多的像素点，这样可以呈现更好的可视效果的屏幕。例如，我的笔记本是15.6寸，理论上它的屏幕分辨率应该是1920 x 1080像素，但实际上我的笔记本屏幕分辨率确实2560 x 1440像素，也就是俗称的2K屏。这 ...
Vue列表过滤与排序
概述 下面我将通过两个例子讲解列表过滤和排序，总的来说主要使用了数组的filter 和 sort 方法 测试数据定义 persons:[ {name:'雷小军',age:44,sex:'男'}, {name:'李连杰',age:55,sex:'男'}, {name:'李彦宏',age:23,sex: ...
你是怎么理解ES6中 Promise的？使用场景？
一、介绍 Promise，译为承诺，是异步编程的一种解决方案，比传统的解决方案（回调函数）更加合理和更加强大 在以往我们如果处理多层异步操作，我们往往会像下面那样编写我们的代码 doSomething(function(result) { doSomethingElse(result, functi ...
