- 博客(22)
- 收藏
- 关注
原创 localStorage、sessionStorage、cookie的区别以及应用场景
Cookie适用于需要跨会话保持的数据,并且需要在客户端和服务器之间传输的数据(如身份验证信息)。适用于存储单个会话期间需要的数据,且这些数据只在当前标签页或窗口中有效。适用于需要持久化存储的数据,如用户偏好设置,这些数据跨会话存在,且在同源的所有标签页和窗口中共享。选择哪种存储方式取决于你的具体需求,包括数据的生命周期、大小限制以及是否需要跨请求或跨会话共享。
2024-08-22 10:22:44
618
原创 scss与css的区别,以及常用场景
SCSS(Sassy CSS)是Sass(Syntactically Awesome Stylesheets)的一种语法风格,它是CSS的扩展语言,增加了许多有用的特性,如变量、嵌套规则、混合(Mixins)、继承(Inheritance)以及颜色操作等,旨在使CSS的开发更加高效和易于维护。
2024-08-20 17:31:01
692
原创 css中:root用法
在CSS中,:root是一个伪类选择器,它用来匹配文档的根元素。在HTML文档中,:root实际上总是指向<html>元素。:root的主要用途是定义一个全局的CSS变量(也称为CSS自定义属性),这些变量可以在整个文档的任何地方被引用。使用CSS变量可以让你的样式表更加灵活和易于维护,特别是当你在多个地方需要重复使用同一个值时。通过:root定义的变量,你可以在整个项目中轻松地更新这个值,而不需要去查找和替换所有实例。
2024-08-07 14:30:00
2104
原创 微信开发者工具登录时显示:网络连接失败错误时
微信开发者工具登录时显示:网络连接失败错误时解决办法1:清除缓存解决办法2:换个网络(可以连接自己手机热点试试)
2024-08-06 14:39:23
818
原创 css中before的用法
是一个伪元素,它允许你在元素的内容之前插入内容。这个伪元素非常有用,因为它允许你添加装饰性的内容、图标、计数器或其他视觉元素,而不需要额外的HTML元素。伪元素的一些常见用法。实际上,由于它的灵活性和创造性,你可以用它来实现各种各样的效果和布局。
2024-06-18 09:54:27
951
原创 浮点数计算精度问题
处理JavaScript浮点数精度问题时,最重要的是要了解浮点数的表示方式和限制。根据具体的应用场景,可以选择合适的解决方案,如使用字符串格式化、四舍五入、转换为整数进行运算、使用专门的库或谨慎处理浮点数比较。
2024-06-18 09:48:36
590
原创 树转平铺,平铺转树
在前端开发中,经常需要将树形结构(nested structure)转换为平铺结构(flat structure),或者将平铺结构转换为树形结构。下面我会给出这两种转换的JavaScript示例代码。
2024-06-18 09:42:51
851
原创 JS中this指向问题
在全局上下文中,this通常指向全局对象(如window当函数被直接调用时,this指向全局对象或undefined(严格模式)。当函数作为对象的方法被调用时,this指向该对象。在构造函数中,this指向新创建的对象实例。在事件处理器中,this指向触发事件的元素。箭头函数不创建自己的this上下文,而是捕获其所在上下文的this值。
2024-06-06 20:09:33
201
原创 JS浮点数比大小
在比较浮点数大小时,由于精度问题,直接比较可能不可靠。因此,我们可以采用上述方法来提高比较的准确性。其中,使用容差值进行比较是最常用的方法,因为它既灵活又相对准确。你可以根据自己的需求选择合适的方法。
2024-06-06 20:04:09
1042
原创 vue中常见事件修饰符及其用法
在Vue中,事件修饰符提供了一种简洁的方式来处理DOM事件的触发行为。修饰符主要用于改善移动端页面的性能,特别是在处理滚动和触摸事件时。在这个例子中,当表单提交时,页面不会重新加载,因为。方法,而点击div的空白区域(避开按钮)时才会触发。在这个例子中,当你点击按钮时,首先会触发外层的。方法会被调用,并且点击事件不会冒泡到父元素。方法(因为是在捕获阶段),然后才会触发按钮的。在这个例子中,无论你点击按钮多少次,在这个例子中,点击按钮时只会触发。方法只会在第一次点击时被调用。在上面的例子中,点击按钮时,
2024-06-06 20:00:55
757
原创 CSS弹性布局
在网页设计和开发中,CSS弹性布局(Flexbox)为我们提供了一种高效、灵活的方式来布局、对齐和分布页面元素。它允许我们在不同的屏幕尺寸和设备上创建复杂的布局结构,而无需担心元素的尺寸和位置。通过合理运用弹性布局的属性和值,我们可以轻松地实现响应式设计,确保页面在不同设备和屏幕尺寸上的良好呈现。通过调整盒子之间的间距,我们可以轻松地实现响应式布局,适应不同的屏幕尺寸和设备类型。,我们确保了盒子在主轴上均匀分布,并在第一个和最后一个盒子与容器的边界之间留有相等的间距。,我们定义了主轴的方向为水平方向。
2024-01-12 09:10:25
473
1
原创 ES6新特性
它引入了许多新的特性,使得JavaScript语言更为强大、灵活和易于使用。ES6引入了许多新的特性和语法,使得JavaScript语言更为强大和灵活。通过使用这些新特性,我们可以编写更简洁、易于理解和维护的代码。在未来的开发中,我们建议广泛使用ES6及其后续版本中的新特性,以提升我们的代码质量和开发体验。类是ES6中实现面向对象编程的一种新方式,它基于原型的继承模型。箭头函数是ES6中一个新的函数表示方式,它比普通函数更为简洁。ES6对函数的参数也进行了增强,允许使用默认参数、具名参数和剩余参数。
2024-01-12 09:04:27
429
1
原创 vue中插槽的使用
在使用插槽时,我们需要注意一些细节,如默认插槽没有特定的名称,具名插槽允许我们为特定区域提供内容,而作用域插槽允许我们传递数据并在子组件的插槽内部使用这些数据。这个对象在子组件的作用域插槽内部是可用的,我们可以在作用域插槽的模板中直接访问这个对象的属性,并使用它们来展示用户信息。在Vue 2中,插槽是一个强大的功能,它允许我们在父组件中定义内容区域,并在子组件中插入内容。作用域插槽允许我们在父组件中传递数据给子组件,并在子组件的插槽内部使用这些数据。具名插槽允许我们在父组件中为子组件的特定区域提供内容。
2024-01-12 08:55:02
668
1
原创 CSS入门学习
CSS入门学习一、CSS简介1、什么是CSSCSS:Cascading Style Sheet 层叠样式表是一组样式设置的规则,用于控制页面的外观样式2、为什么使用CSS实现内容与样式的分离,便于团队开发样式复用,便于网站的后期维护页面的精确控制,让页面更精美3、CSS作用页面外观美化布局和定位二、基本用法1、CSS语法<head> <style> 选择器{ 属性名:属性值; 属性名:属性值; } </style>&l
2023-12-29 17:25:22
1568
1
原创 Web前端发展:2023年的回顾与展望
此外,动态导入和代码拆分等技术也得到了广泛应用,帮助开发者将大型应用拆分为多个小型模块,按需加载和渲染,进一步提高了应用的性能和响应速度。通过使用组件化的开发方式,开发者可以将复杂的Web应用拆分为一系列可复用的组件,每个组件都具有明确的职责和独立的状态管理。同时,我们也看到了新的框架和库的涌现,如Svelte、Nuxt.js和Quasar等,它们在特定场景下提供了优秀的解决方案。此外,Angular还推出了一些新特性,如更强大的表单控制和更灵活的路由系统,让开发者能够更加高效地构建复杂的前端应用。
2023-12-29 17:04:24
1009
1
原创 Vue2中的devServer.proxy配置详解
在上面的配置中,我们将所有以/api开头的请求代理到后端服务器。在Vue2中,devServer.proxy是一个非常重要的配置项,它允许开发者将某些特定的API请求代理到后端服务器,从而实现前后端分离的开发模式。为了解决这个问题,我们可以通过代理的方式将前端请求转发到后端服务器,从而实现前后端的通信。除了基本配置外,devServer.proxy还支持更多的高级配置选项,以满足更复杂的需求。在Vue2中,我们可以在vue.config.js文件中对devServer.proxy进行配置。
2023-12-29 10:51:38
4478
1
原创 常见的行内元素,行内块元素,块级元素,以及他们的区别
常见的行内元素有:a、span、img、button等。这些元素的特点是:相邻的行内元素不会换行,且只能容纳纯文本或其他的行内元素(a标签除外),因此只能水平方向设置宽和高。了解这三种元素的差异可以帮助我们更好地控制网页的布局和样式,提高网页的质量和用户体验。这些元素的特点是:会独占一行,高度、宽度、外边距和内边距都可以控制,且默认宽度是容器的100%。行内块级元素有:button等。这些元素的特点是:和其他行内或行内块级元素元素放置在同一行上,且高度、宽度、行高以及顶和底边距都可设置。
2023-12-29 10:42:29
546
1
原创 vue2组件通信详解(父传子,子传父,vuex,兄弟bus,$attrs,$listeners,插槽,$refs)
这样,父组件就可以将数据传递给子组件中的插槽内容,并在子组件中使用这些数据进行渲染。使用作用域插槽,父组件可以将数据绑定到一个特殊的属性上(通常是v-slot或#),并在父组件中将需要插入到子组件中的内容放在一个标签中。然后,父组件在模板中引用这个名称,将父组件中的内容插入到子组件的对应插槽中。在上面的示例中,父组件将一个名为"myProp"的prop传递给子组件,并将一个名为"class"的额外属性传递给子组件。attrs不同,$listeners中的监听器是在父组件中定义的,而不是在模板中定义的。
2023-12-29 10:21:36
1597
1
原创 Promise用法
这对于创建库或框架非常有用,因为你可以使用 Promises 来封装异步操作,并确保它们以一致的方式被处理。同时,通过返回一个新的 Promise,你可以控制异步操作的流程和结果。方法接受一个回调函数作为参数,无论 Promise 是成功还是失败,这个回调函数都会被执行。方法返回一个新的 Promise 实例,该实例会在输入的 Promise 实例中最早完成(无论是成功还是失败)时,以同样的结果完成。这些方法可以用来创建新的 Promise 实例,并提供了更简洁的方式来处理异步操作。函数中,我们可以使用。
2023-12-29 09:41:09
366
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人