自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(58)
  • 资源 (1)
  • 收藏
  • 关注

原创 2024年最新前端面试题汇总大全二(含答案超详细,Vue,TypeScript,React,微信小程序,Webpack 汇总篇)-- 持续更新

vue指令vue2局部注册:directive选项'focus': {el.focus()全局注册:main.jsel.focus()})生命周期bind:只调用一次,指令第一次绑到元素调用,用于初始化inserted:被绑定元素插入父节点时调用update:所在组件vnode更新调用componentUpdate:指令在组件的vnode及子组件的vnode全部更新完调用ubind:只调用一侧,指令解绑vue3局部注册。

2023-05-29 19:30:57 6818

原创 vue面试题汇总

vue指令vue2局部注册:directive选项'focus': {el.focus()全局注册:main.jsel.focus()})生命周期bind:只调用一次,指令第一次绑到元素调用,用于初始化inserted:被绑定元素插入父节点时调用update:所在组件vnode更新调用componentUpdate:指令在组件的vnode及子组件的vnode全部更新完调用ubind:只调用一侧,指令解绑vue3局部注册。

2023-05-26 22:00:41 6750

原创 javascript面试题--持续更新

事件代理(),又称之为事件委托。是JavaScript中常用绑定事件的常用技巧。顾名思义,“事件代理”即是把原本需要绑定的事件委托给父元素,让父元素担当事件监听的职务。事件代理的原理是DOM元素的事件冒泡。使用事件代理的好处是可以提高性能可以大量节省内存占用,减少事件注册,比如在table上代理所有td的click事件就非常棒可以实现当新增子对象时无需再次对其绑定。

2023-05-13 11:58:27 4191

原创 详细前端面试题CSS篇--持续更新

margin(外边距)- 清除边框外的区域,外边距是透明的。border(边框)- 围绕在内边距和内容外的边框。padding(内边距)- 清除内容周围的区域,内边距是透明的。content(内容)- 盒子的内容,显示文本和图像。W3C的标准盒模型:在标准的盒子模型中,width指content部分的宽度IE的盒模型:在IE盒子模型中,width表示content+padding+border这三个部分的宽度如何开启不同盒子模型标准盒子模型IE盒子模型Grid。

2023-05-12 11:38:12 2546 1

原创 详细前端面试题HTML篇

渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用,然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。

2023-05-11 14:12:10 2809

原创 2024年最新前端面试题汇总大全(含答案超详细,HTML,JS,CSS汇总篇)-- 持续更新

最新前端面试题汇总大全(含答案超详细)--持续更新

2023-05-11 11:55:41 21488 1

原创 vue3使用百度地图(详)

百度地图学习,vue3学习地图,vue地图学习,AK密钥申请,vue-baidu-map-3x,自定义地图样式,vue-baidu-map-3x控件学习

2023-03-29 21:18:59 12840 4

原创 CSS - Pseudo-classes(伪类选择器)

CSS 伪类(Pseudo-classes) 用于定义元素的特定状态或结构位置,从而允许你为这些特殊场景添加样式。伪类以冒号 : 开头,附加在选择器后/* 举例 */a:link{

2025-03-17 23:22:37 971

原创 CSS -属性值的计算过程

important > 行内样式(比重1000)> ID 选择器(比重100) > 类选择器(比重10) > 标签(比重1) > 通配符 > 继承 > 浏览器默认属性。理解好上述流程后,打开控制台我们可以看到a标签存在浏览器的默认样式,属于。上述通过步骤二,可以提取出的 font-size:16px;对样式表有冲突的声明使用层叠规则,确定CSS属性值。对仍然没有值得属性,若可以继承,则继承父元素的值。参考样式表中没有冲突的声明,作为css属性值。对仍然没有值的属性,使用默认值!上述通过步骤一,可以提取出。

2025-03-16 20:21:45 955

原创 CSS -position(定位)

为了更明显的对比出relative和absolute的定位参照,我们可以将boxs.position调整为absolute进行突出对比。视口:视口通常是浏览器窗口中除去边框、菜单栏、地址栏和状态栏等之外的区域,用户可以通过调整浏览器窗口的大小来改变视口的尺寸。

2025-03-16 18:35:29 930

原创 CSS Sprite (精灵图/雪碧图)

合入background*/减少 HTTP 请求。

2025-03-15 18:44:02 560

原创 React封装通用Form组件,类型转换、命名控件样式隔离、支持表单验证、位置自定义、自定义布局、提示信息info等功能。未采用二次封装调整灵活,包含使用文档

BasicFormModal 是一个Form模态框组件,类型转换、命名控件样式隔离、支持表单验证、位置自定义、自定义布局、提示信息info等功能。它适用于需要在模态框中收集用户输入数据的场景。美观的表单字段布局响应式表单布局错误提示消息样式提示图标和提示文本样式模态框遮罩层效果。

2025-03-08 23:26:20 737

原创 解决ES版本语法在旧版本项目不兼容问题,举例:可选链式操作符

使用webpack+babel-loader是支持可选链操作符最简单的方式,直接在webpack配置中添加babel-loader及其选项,无需额外的配置文件,即可在项目中使用这一便捷的语法特性。

2025-03-05 22:40:11 399

原创 React封装通用Table组件,支持搜索(多条件)、筛选、自动序号、数据量统计等功能。未采用二次封装调整灵活,包含使用文档

BasicTableModal 是一个表格模态框组件,提供了搜索、筛选、自动序号、数据量统计等功能。它适用于需要在模态框中展示表格数据的场景。title: '姓名',

2025-03-01 15:55:34 883

原创 requestAnimationFrame(rAF)使用,与传统方法(如 setTimeout/setInterval),直观展示 rAF 的优势

requestAnimationFrame 的核心优势是与浏览器渲染流程深度集成,通过减少无效渲染、自动节流、帧率同步等机制,显著提升动画性能。

2025-02-20 23:19:36 972

原创 CSS3新特性

CSS 自定义属性(也称为 CSS 变量)允许你在 CSS 中定义可重用的值,并在整个样式表中引用。它们以 – 开头,并通过 var() 函数调用自定义属性通常在 :root 选择器中定义,以便全局使用通过 var() 函数引用自定义属性。

2025-02-13 22:39:02 262

原创 HTML5新特性(尽我所能,希望对你有所帮助)

!!!存储限制:存储大小:大多数浏览器对 localStorage 和 sessionStorage 的存储限制为 5MB 左右。数据类型:存储的数据必须是字符串。如果要存储对象或数组,可以使用 JSON.stringify() 将其转换为字符串,读取时使用 JSON.parse() 转换回对象或数组。5.Canvas 和 SVG这里有canvas绘制简单图形的步骤,感兴趣可以看看,这个是是后续会总体整理的面试大纲svg与canvas区别主要事件:关键属性:特点:这里特殊提下,ws创建成功的状态码

2025-02-06 22:21:34 1064

原创 css如何隐藏一个元素

opacity: 0: 将元素的透明度设置为 0,以此来实现元素的隐藏。元素在页面中仍然占据空间,并且能够响应元素绑定的监听事件。display: none: 渲染树不会包含该染对象,因此该元素不会在页面中占据位置,也不会响应绑定的监听事件。visibility: hidden: 元素在页面中仍占据空间,但是不会响应绑定的监听事件。transform: scale(0,0): 将元索缩放为 0。z-index: 负值: 来使其他元素遍盖住该元素。

2025-01-06 22:47:53 341

原创 overflow属性介绍(图例+代码)

* 仅在需要时显示滚动条 *//* 内容溢出时可见 *//* 内容溢出时隐藏 *//* 始终显示滚动条 */

2025-01-06 21:51:27 609

原创 CSS Grid 布局示例(基本布局+代码属性描述)

* 针对子元素的行列设置,可以先根据这里绘制出一个简化版表格,然后根据表格的线来理解 2/3的含义 ,-1代表从当前开始到结束 */| 列1 | 列2 | 列3 |/* 三行 100px 1fr自适应 100px*//* 两列 200px 1fr自适应*//* 简写方式 2/3*//*网格间距10px*/

2025-01-06 21:37:50 417

原创 三栏布局 - 四种实现方式(flex/float/grid/position定位)

【代码】三栏布局 - 四种实现方式(flex/float/grid/position定位)

2024-12-30 18:32:55 200

原创 谷歌开发者工具 - 网络篇

场景:后台定义好协议后,可以通过自己定义内容来直接进行联调,不需要伪代码且流程顺畅。

2024-12-27 21:17:59 1637

原创 node.js文件压缩包解析,反馈解析进度,解析后的文件字节正常

解决方案:引入其余库解决tar-fs/tar-stream/zlib。

2024-12-27 10:03:10 553

原创 谷歌开发者工具 -来源/源码篇

显示文件树的页面标签页。此处列出页面请求的每个文件。部分。在网页标签页中选择文件后,此处会显示该文件的内容。Debugger部分。检查页面 JavaScript 的各种工具。

2024-12-25 20:32:18 984

原创 谷歌开发者工具 - 控制台篇

这里几乎不用,看起来会很新奇有意向可以去官网看看hl=zh-cn。

2024-12-24 19:15:40 1421

原创 谷歌开发者工具-元素篇

注意:截取节点屏幕截图,截取的不是当前元素内容,而是基于元素位置截图。

2024-12-23 18:33:08 1265

原创 封装indexDB处理方法,重写为localStorage类似形式

我的场景:资源超出localStorage最大存储容量,资源通过后台获取响应时间较长。

2024-12-21 18:09:25 294

原创 射线法:实现检测绘制是否在指定不规则区域内(函数)

【代码】射线法:实现检测绘制是否在指定不规则区域内(函数)

2024-12-21 16:36:17 129

原创 事件循环 -- 资源总结(浏览器进程模型、事件循环机制、练习题)

!!理解学习,有问题/补充欢迎指出,随时改正!!!

2024-11-13 23:36:45 326

原创 console.log打印数组在控制台中显示的长度正常,实际展开内容变化

控制台的延迟渲染:浏览器控制台在显示数组时,可能会使用一种延迟渲染的机制。当你点击展开数组时,控制台会重新计算数组的内容,并显示最新的状态。console.log打印数组在控制台中显示的长度正常,实际展开内容变化。这里不要理解为console.log。

2024-11-06 10:51:31 232

原创 Electron构建桌面应用程序,自主学习记录(持续更新...

4.检查node/npm是否正确安装 node -v && npm -v。一.nvm安装node方式以及可能出现问题的解决方案。新建main.js文件。

2024-10-08 18:58:47 1512

原创 Ant Design使用Form,手动触发onchange相同事件函数,组件内收到真实数据未更新

在Ant Design的Form组件中,getFieldDecorator 会为表单字段创建一个。上面通过手动触发实际上避开了onchange后续的处理逻辑,此时需要遵循Form更新方案更新。元素属性存在方向,需求为提供快捷编辑方向按钮,保证方向沿基准方向。事件处理函数更新表单字段的值时,Form组件会。

2024-08-23 11:11:35 365

原创 toLocaleString浏览器兼容问题,导致时间在不同版本显示24/12小时制

较新版本的 Chrome(版本 125.0.6422.142)已经更新了其国际化实现,以默认使用24小时制。较旧版本的 Chrome(版本 86.0.4240.198)仍然使用12小时制。

2024-06-18 11:36:12 470

原创 实现搜索功能中搜索内容高亮效果,本文通过fuzzysort库方案实现

fuzzysort是一个 JavaScript 库,用于对字符串数组进行模糊搜索和排序。它特别适用于自动补全(autocomplete)功能,可以根据用户输入提供匹配的建议列表,即使输入存在拼写错误或部分匹配也能够有效工作相比正则方法的优势:更加灵活,即使输入存在拼写错误或部分匹配也能够有效工作fuzzysort库中的一个核心函数,用于执行模糊搜索一:接收参数1.searchKeywords(搜索关键词):字符串,表示用户输入的搜索关键词。

2024-06-14 19:07:53 264

原创 数据采样函数,主要用于数据可视化时减少图形的复杂度,同时保持数据的整体特征

【代码】数据采样函数,主要用于数据可视化时减少图形的复杂度,同时保持数据的整体特征。

2024-06-12 14:11:20 136

原创 antd记录table组件,包含(行复选属性设置,斑马色,ellipsis导致文本隐藏,scroll列错乱,tbody滚动条样式)

【代码】antd记录table组件,包含(行复选属性设置,斑马色,ellipsis导致文本隐藏,scroll列错乱,tbody滚动条样式)

2024-04-23 17:52:25 335

原创 前端导出文本内容为csv文件,excel乱码

原因:编码格式问题,需要改为。

2024-04-02 15:52:28 485

原创 canvas使用webgl导致内存泄漏如何清理

场景:切换路由重新加载画布,发现随着切换内存累加。原因:webgl未手动清理导致内存泄漏。

2024-04-02 09:44:40 648

原创 createjs实现贪吃蛇,包含成长及游戏条件重置

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>CreateJS 贪吃蛇游戏</title> <script src="https://code.creat

2024-03-22 17:01:59 830

原创 antd-select组件样式,option下拉选中勾选样式,下拉箭头位置,使用Drawer样式失效

当你设置了 getContainer={false},Drawer 将直接渲染在其父组件内,而不是作为 body 的直接子元素。getContainer 属性决定了 Drawer 渲染的 HTML 节点位置,默认情况下,Drawer 会被渲染到 body 元素上。这样做的好处是避免了 Drawer 内容的样式受到外部容器样式的影响。的问题,尤其是当 Drawer 包含诸如下拉菜单这样需要==“溢出”==(overflow)的子组件时。组件时,在less写法中修改下拉样式。注意:如果在使用抽屉。

2024-03-07 18:27:41 1359

App.vue

App.vue

2022-09-26

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除