大前端--全面的前端编程教程 - 秘密武器开发者中心

百分比编码

百分比编码（percent encoding），也称为URL编码的一部分。这是一种编码机制，它将非ASCII字符通过一种可打印的形式编码，通常用在URL中，以便发送不安全或者无法直接传输的字符。百分...

admin 2024-02-11 95 0

foreach和map的区别(原创)

foreach和map的区别1、相同点(1)都是循环遍历数组中的每一项。(2)每次执行匿名函数都支持三个参数，参数分别为item(当前每一项)，index(索引值)，arr(原数组)。(3)匿名函数中的th...

admin 2024-02-01 157 0

纯js实现左右无限滚动广告(原创)

利用纯js实现左右滑动、鼠标悬停暂停效果css代码<style>#scroll-container {width: 80%;overflow: hidden;margin: auto;white-space: nowrap;position: relative;}.scroll-...

admin 2024-02-01 86 0

flex常用属性

给父元素加 display: flex主轴 justify-content: center 居中 justify-content: space-between 空白间隙（俩边不留） justify-content: space-around 每个item都有相同间隙（...

admin 2024-01-31 117 0

css居中相关面试题

css水平居中/*方法1:inline-block + text-align */.parent { text-algin: center;}.child { display: inline-block;}/*方法2:block + margin */.parent { margin:...

admin 2024-01-20 57 0

左右滑动导航居中

近期遇到一种需求就是，顶部自适应后可以实现左右滑动，在大屏的时候要居中首先我用的是flex布局你也一定和我一样想着使用justify-content: center来居中，这样有问题当我们在小...

admin 2024-01-19 67 0

css蜂窝效果

一个简单的效果其实就是用了clip-path这个属性，可以在这个网站快捷的使用clip-path定义自己的效果剪切路径上代码<!DOCTYPE html><html lang="en"><head><meta charset="UTF-...

admin 2024-01-19 134 0

JS判断用户语言跳转到对应中文和英文站点

其实这些方法百度有很多，秘密武器开发者中心总结一个比较好理解，兼容性也比较好的方法中文站点模版添加<script> var lang = navigator.language || navigator.userLanguage;/...

admin 2024-01-16 179 0

css实现按钮边框旋转动画

效果就是这样主要思路：利用index设置不同层，然后使他的背景旋转<div class="btn"><span>秘密武器开发者中心</span></div>css如下<style>.btn {width: 150px;height: 40px;pad...

admin 2024-01-15 188 0

vim编辑器无法删除代码

在使用 vim 编辑器时，如果你无法删除代码，可能是因为你目前处于 "Normal"（一般）模式。在 "Normal" 模式下，按键有不同的功能而并非直接输入字符。为了编辑文本，你需要切换到 "Inse...

admin 2024-01-14 99 0

在vue中正确的使用swiper

首先安装swipercnpm install swiper@5.4.5 -Scnpm install vue-awesome-swiper@3.1.3 -S二、在main.js中引入swiper.cssimport 'swiper/css/swiper.css'三、在组件...

admin 2024-01-11 102 0

vue中使用swiper轮播图

关于swiper当前swiper已经到了8版本。6版本及以上，已经支持了直接在前端框架中的使用。6以下版本，不支持直接在前端框架中使用。也就是说， 6以下版本，没有swiper-vue.jsswiper7...

admin 2024-01-11 126 0

原生的JavaScript来复制文本内容

在HTML中使用原生的JavaScript来复制文本，通常会涉及到创建一个临时的 `textarea` 或者 `input` 元素，将需要复制的文本设置到该元素的 `value` 属性中，然后执行复制命令。关于...

admin 2024-01-10 20 0

vue的路由传参有那些方法

Vue的路由传参大致上有三种方法：Query参数：也就是我们最常见的在网址后面加上?key=value的方法。比如说你要去一个页面，你要带上一些信息，就像朋友家里做客带上一瓶饮料。在Vue...

admin 2024-01-07 82 0

js-cookie的使用

js-cookie 是一个简单、轻量级的JavaScript API，用于处理cookie。如果您希望使用 js-cookie 来设置带有过期时间的token，您可以按照以下步骤进行：首先确保您的项目中已经包含了...

admin 2024-01-02 97 0

vuex 在组件中怎么触发vuex中的mutation

在 Vue.js 应用程序中，Vuex 用于集中管理共享的应用程序状态。在组件中触发 Vuex 中的 mutations 是一个简单的过程。以下是在 Vue 组件内触发 Vuex 中的 mutation 的基本步...

admin 2024-01-01 39 0

vue-router执行路由跳转传参

如果你要传递一个名为userId的参数到/home页面，你可以这样做：通过查询参数：this.$router.push({ path: '/home', query: { userId: '123' } });在home页面的组...

admin 2023-12-31 169 0

vue中打包分析代码大小

npm run preview -- --report将几个比较大的多在打包时排除，这样可以缩小整体打包的大小，保证js的加载速度，排除的包采用cdn的方式用外链去引入，cdn本名为分发服务器，意为更近的...

admin 2023-12-29 81 0

localstorang怎么设置过期时间

LocalStorage 本身并不支持设置过期时间。它是一种在客户端存储数据且没有到期时间的机制，存储的数据会一直存在，除非用户清除浏览器的数据或者通过代码进行删除。如果你想要...

admin 2023-12-28 57 0

vue中hash模式和history的区别

hash模式带#，#后面的地址变化不会引起页面的刷新history没有#，地址变化会引起页面刷新，更符合页面地址的规范（开发环境不刷新-webpack配置）将路由模式修改成history模式const cre...

admin 2023-12-28 188 0

vue中echarts图表的基本使用

安装echarts包$ npm i echarts $ yarn add echarts放置两个图表的div...

admin 2023-12-27 39 0

无头像时，显示名字第一个字

如果我们有头像的时候可以调用后端给我们的头像地址，如果没有可以这样写<span v-else class="username" > {{name?.charAt(0)}}</span>显示效果css如下.username {...

admin 2023-12-27 183 0

vue2中的mixin的使用方法

// mixin.jsexport const myMixin = { created() { console.log('Mixin hook called'); }, methods: { foo() { console.log('foo'); },...

admin 2023-12-27 150 0

vue数字滚动插件

$ npm i vue-count-to引入注册import CountTo from 'vue-count-to'export default { components: { CountTo }}使用<count-to :start-val="0" :end-va...

admin 2023-12-27 85 0

网站怎么设置第三方字体库（含有vue项目）

将第三方字体库应用于你的网站通常包括以下几个步骤：1. 选择字体库首先，你需要选择适合自己需求的第三方字体库。一些常见的字体库包括谷歌字体（Google Fonts）、Typekit、Font S...

admin 2023-12-25 107 0

大前端

标签列表