- 博客(41)
- 收藏
- 关注
原创 安卓edge://inspect 和 chrome://inspect调试移动设备上的网页
和是用于调试浏览器中运行的网页和移动设备上的网页的工具。这两个工具分别属于 Microsoft Edge 和 Google Chrome 浏览器。
2025-03-17 18:27:20
831
原创 针对 ECharts在uni事件失效 因误判全局变量 wx 导致在普通 H5 环境中运行异常的问题
全局变量时,ECharts 会错误地切换到小程序模式,导致渲染异常或 API 调用错误。来源) + 方案4(升级 ECharts),实现标本兼治。的功能(如微信 JSSDK),会直接破坏相关逻辑。精准控制 ECharts 的运行模式,兼容性更强。覆盖 ECharts 的默认环境推断逻辑。:方案2(强制指定环境) + 方案3(消除。变量,欺骗 ECharts 的环境检测。移除不必要的微信 JSSDK 引用。:推荐所有需要明确环境控制的场景。:简单直接,一行代码解决问题。误引入的微信 JSSDK(如。
2025-03-12 14:41:34
365
原创 Web Worker如何在本地使用
使用 Blob 来动态创建 Worker,而不是直接引用外部的 worker.js 文件,那么你可以完全避免文件路径和本地服务器的限制问题。这种方式非常适合将 Worker 代码嵌入到主脚本中,而不需要额外的文件。
2025-03-10 16:45:03
472
原创 将数字格式化为千位分隔的形式
方法用于将数字格式化为千位分隔的形式,并且可以指定小数位数。日常做笔记,如果有更好的方法,欢迎分享。直接上代码,下面有解释。
2025-03-07 16:28:40
155
原创 页面生命周期的不同阶段DOMContentLoaded、load、beforeunload 和 unload
方法来监听事件,并在事件触发时执行相应的回调函数。确保在不需要时移除事件监听器以避免内存泄漏。这些事件在原生 JavaScript 中的使用非常直接,通过。
2025-03-04 14:45:06
418
原创 移动端访问PC页面浏览器的默认缩放机制
在移动端浏览器中,当用户点击输入框(如密码输入框)时,页面可能会自动放大以提高可读性。这种行为通常是由于浏览器的默认缩放机制引起的。
2025-02-25 16:36:05
197
原创 上传解析 Excel 表(XLSX 文件)转为JSON数据
以下是一个完整的示例,展示了如何读取文件并解析 XLSX 文件。这样可以更清晰地理解每行代码的作用,并且确保你能够正确使用。以下是一个完整的 Vue 组件示例,展示了如何使用。为了读取文件内容,你可以使用。在你的 Vue 组件中导入。库来解析 XLSX 文件。
2025-02-14 19:01:19
629
原创 PapaParse 用于解析 CSV 和 TSV 文件 JavaScript 库
PapaParse是一个用于解析 CSV 和 TSV 文件的 JavaScript 库,它在浏览器和 Node.js 环境中都能很好地工作。以下是如何使用PapaParse以及它的一些主要功能。
2025-02-14 11:09:37
991
原创 YYYY-mm-dd时间格式化方法
详细说明 函数签名:初始化日期对象:检查 类型:定义格式化选项:遍历格式化选项:返回格式化后的日期字符串:希望这些注释能帮助你更好地理解和使用这个函数!如果有任何问题或需要进一步的帮助,请随时告诉我!
2024-11-15 15:38:59
460
原创 sanitize-html 防止 XSS(跨站脚本攻击)
是一个用于清理和验证 HTML 的 JavaScript 库,主要用于防止 XSS(跨站脚本攻击)。它允许你定义一套规则来决定哪些 HTML 标签和属性是可以被信任的,从而确保用户输入的内容不会包含潜在的恶意代码。
2024-11-12 16:31:28
785
原创 css移动端设备的安全区内边距
主要是为了处理 iOS 设备上的“刘海屏”和其他不可见区域而引入的,但现代的 Android 设备也存在类似的问题,例如屏幕凹槽、摄像头打孔、底部导航栏等。来获取设备左右的安全区内边距。这些属性用于确保内容不会被设备左右的不可见区域(如侧边按钮或边框)遮挡。为了确保在不同浏览器和不同版本的 iOS 上都能正确处理安全区内边距,通常会同时使用。iPhone X 及其后续型号的“刘海”和底部导航栏。这样可以确保在所有支持的浏览器中都能获得正确的效果。函数,可以确保内容不会被这些区域遮挡。
2024-11-12 11:57:19
633
原创 SASS 控制指令详解@for、@if、@each、@while
for循环:用于生成一系列重复的样式规则,支持和两种形式。@if条件语句:根据条件生成不同的样式规则,可以与@else if和@else一起使用。@each循环:用于遍历列表或映射,并为每个项生成样式规则。@while循环:用于创建基于条件的循环,直到条件不再满足为止。语法示例:生成一系列背景颜色和宽度类。注意事项:确保在每次迭代中更新条件变量,避免无限循环。
2024-11-12 10:26:34
773
原创 css中的变量使用
在 CSS 中,变量使用--前缀来定义。通常在:root选择器中定义全局变量,以便在整个文档中使用。:root {定义变量:使用--前缀在 CSS 中定义变量。使用变量:使用var()函数引用变量。全局变量:在:root选择器中定义,可在整个文档中使用。局部变量:在特定的选择器中定义,只在该选择器及其子选择器中有效。动态更新:可以通过 JavaScript 动态更新 CSS 变量,实现动态样式变化。CSS 变量可以在任何选择器中定义,不一定要写在:root里面。:root。
2024-11-11 18:49:03
732
原创 HBuilderX运行微信小程序,编译的文件在哪,怎么运行
4. 如果设置完开发路径,跳转到微信开发者工具了,但是没自动打开编译文件,代表 AppID 不同,可以手动点击主页面导入,将 unpackage -- dist -- dev -- mp-weixin 编译后文件导入,在导入时将 AppID 设置与HBuilderX 的一致,下次就可以直接启动,AppID 可以使用测试号,也可以在微信小程序官网进行注册,申请到 AppID。3. window系统的话点击顶部工具 -- 设置 --运行配置 --微信开发工具路径。
2024-11-07 15:10:27
2751
原创 iframe触发内嵌网页的事件和父子网页的通信方式
load1. 在使用iframe时,常见的通讯方式之一是使用方法。这种方法允许在不同源的窗口之间进行安全的通信。
2024-11-01 11:55:38
1438
原创 关于非中文或者url文本不换行的问题
作用:强制文本在任意字符处换行,即使在一个单词内部也会进行换行。适用场景:适用于需要按字符截断换行的情况,特别是当文本中包含长单词或长字符串时,可以避免文本溢出容器。浏览器支持:广泛支持,包括 IE、Chrome 和 Firefox。
2024-10-27 06:48:37
648
原创 vue中使用 html2canvas绘制 HTML 元素成图片并下载
安装:使用 npm 或 yarn 安装。在 Vue 组件中使用:通过ref获取需要转换的 DOM 节点,使用将其转换为 canvas,再将 canvas 转换为数据 URL 并显示在页面上。提供下载功能:创建一个隐藏的元素,设置其href和download属性,触发点击事件以下载图像。希望这个对你有帮助,如有不足欢迎评论和补充。
2024-10-24 21:01:26
827
原创 JavaScript 中怎么判断前端各种运行环境
在 JavaScript 中,可以通过多种方式来判断前端应用的运行环境,比如浏览器环境、Node.js 环境、React Native 环境等。
2024-10-18 15:57:40
812
原创 ios在复制方面的兼容
在处理h5点击复制时,当用户点击时会触发请求,进行口令转链,并返回转链后的口令,并使用JS直接进行操作执行复制操作,安卓可以成功复制,但是IOS会阻止非用户动作的事件触发,导致复制失败,目前解决方法是返回口令后,触发弹窗,用户点击弹窗后复制成功。如果你的问题是在特定环境下出现的,例如在使用某个特定的 WebView 或 JavaScript 框架,那么可能需要查看相关的文档或社区,看看是否有已知的问题和解决方案。:在某些情况下,如果视图正在渲染或更新,iOS 可能会延迟或阻止事件的触发。
2024-10-18 15:34:47
444
原创 前端将cvs格式数据导出为Excel表
选择哪种方法取决于你的具体需求,比如是否需要在客户端处理大量数据,是否需要支持旧版浏览器,以及是否需要自定义Excel文件的样式等。
2024-10-18 15:25:29
1342
原创 CSS 中 link 和 @import 的用法的区别
一些现代的前端框架和库(如React、Vue)支持CSS-in-JS,这种方式允许你在JavaScript文件中直接编写CSS,并在运行时动态地应用样式。:虽然CSS变量本身不提供动态加载CSS的能力,但它们可以用于主题化和动态改变样式,从而在不更改CSS文件的情况下实现样式的动态变化。在常规的Web开发中,CSS文件的引入是静态的。:在服务端渲染的应用中,可以根据不同的条件动态地决定加载哪个CSS文件,然后将其作为页面的一部分发送给客户端。标签有一些区别,并且在常规情况下,CSS文件的引入是静态的。
2024-08-09 21:07:56
893
原创 hash模式与history模式的区别(详细版)
前端路由的概念起源于单页面应用(SPA, Single Page Application)的发展。SPA通过动态内容更新而不是重新加载整个页面来提高用户体验。前端路由允许开发者定义应用中的不同视图,以及如何在用户与应用交互时导航这些视图。前端路由的和两种模式是实现单页面应用(SPA)中页面导航的两种不同方法。以下是它们之间的主要区别,以及如何配置模式的详细说明。URL结构(表面区别):工作原理:浏览器历史记录:服务器配置:SEO和用户体验:兼容性:Apache: 使用模块。Nginx: 使用指令。Node.
2024-08-04 21:39:33
795
原创 Vue中的修饰符是什么,怎样使用
Vue 中的修饰符(Modifiers)是一种特殊的后缀,用于指示一个指令应该以特殊方式绑定。它们主要用于v-modelv-on(或简写为)等指令上,以提供更灵活的事件处理或数据绑定选项。修饰符以点表示。
2024-07-23 15:52:10
327
原创 localStorage和sessionStorage与cookie
cookie 的属性通常通过键值对的形式在服务器端设置,并通过 HTTP 响应头发送到浏览器。
2024-06-03 14:27:31
1088
1
原创 原型 原型链
当我们尝试访问一个对象的某个属性或方法时,JavaScript会首先在当前对象本身查找该属性或方法。如果找不到,则会沿着原型链向上查找,直到找到为止。由于john对象本身没有这个方法,所以会沿着原型链向上查找,最终在Person.prototype上找到了这个方法并执行。这样,通过每个对象的__proto__属性和构造函数的prototype属性,我们可以将多个对象链接起来,形成一个链式结构,这就是原型链。补充一句,只要是对象就会拥有__proto__属性指向上一级的原型对象。
2024-06-03 10:25:14
1674
原创 过渡动画 关键帧动画
的关键帧动画,该动画会在4秒内循环播放,每次播放的方向都会交替(先正向再反向),并在动画结束后保持最后一帧的样式。过渡动画是当元素从一个状态改变到另一个状态时,自动平滑地过渡其样式变化(如颜色、大小、位置等)。关键帧动画是在动画的特定时间点上定义样式变化,然后浏览器会计算并填充这些关键点之间的中间帧。
2024-06-03 09:31:08
792
原创 事件穿透 pointer-events
时,元素将不会成为鼠标事件的目标,并且鼠标事件会“穿透”该元素并传递给其下方的元素。这在您希望某些元素不可点击但仍然允许用户与其下方的元素交互时非常有用。是一个 CSS 属性,它用于控制元素如何响应鼠标、触摸等指针设备的事件。属性,您可以控制元素是否成为事件的目标,或者是否允许事件“穿透”到其下方的元素。类应用了一个半透明的黑色遮罩层,它覆盖了整个页面。覆盖了按钮,但用户仍然可以点击按钮并触发其点击事件。的设置,这个遮罩层不会阻止用户点击其下方的。属性实现事件穿透的一个例子。
2024-06-01 10:58:22
569
原创 rem 和 em 响应式布局
rem和em都是在 CSS 中用于相对长度单位的。它们使得我们能够更灵活地设置元素的尺寸,特别是在响应式布局中。以下是关于如何使用rem和em实现响应式布局的代码示例和解释。
2024-06-01 10:28:28
1758
原创 字体的响应式处理
总结:字体的响应式处理涉及到相对单位的使用、媒体查询、断点调整、自适应布局以及优化字体可读性和视觉效果等多个方面。通过综合运用这些技术,可以确保文本在不同设备和屏幕尺寸上都能得到良好的展示效果。字体的响应式处理在前端开发中扮演着重要角色,以确保文本在不同设备和屏幕尺寸上都能保持良好的可读性和呈现效果。六、优化字体可读性和视觉效果。五、安全字体和自定义字体。
2024-06-01 10:19:01
512
原创 图片的响应式处理
响应式图片处理涉及多个方面,包括CSS样式、HTML属性、JavaScript以及图片优化等。通过综合应用这些方法,你可以确保你的网站在各种设备和屏幕尺寸上都能提供高质量的图片体验。
2024-06-01 10:12:56
547
原创 弹性网格布局(Flexible Grid Layout)
弹性网格布局(Flexible Grid Layout)是一种现代的网页布局技术,它结合了传统的网格布局和弹性盒布局(Flexbox)的概念,以提供更强大、更灵活的布局控制。
2024-06-01 09:49:11
619
原创 弹性盒子布局 display : flex
弹性盒子布局(Flexbox Layout)是CSS3引入的一种新的布局模式,用于在单个维度(行或列)中高效地布局、对齐和分配容器中的空间,即使子元素的尺寸未知或动态改变。
2024-06-01 09:45:00
405
原创 @media使用方法
media是 CSS3 中的一个重要特性,它允许我们根据设备的特性(如设备的宽度、高度、方向、分辨率等)来应用不同的样式规则。下面是@media。
2024-06-01 09:39:57
1850
原创 CSS中的盒模型
盒模型(Box Model)是CSS中的一个重要概念,用于描述HTML元素在页面中所占空间的方式。它将每个HTML元素视为一个矩形框,这个矩形框由四个主要部分组成,内边距(padding)、边框(border)和外边距(margin)组成的矩形盒子
2024-06-01 09:14:31
267
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人