- 博客(20)
- 收藏
- 关注
RSS订阅转载 前端优化，webpack打包删除无用文件
前言在webpack打包项目过程中，常遇见一些无用的图片，js文件，怎样能够自动检测哪些是无用的文件呢？本文中介绍使用插件useless-files-webpack-plugin查找无用文件，在terminal中删除操作步骤1、安装安装方法cnpm i useless-files-webpack-plugin -D2、具体用法1.在webpack的js中，添加如下代码// 顶部导入插件const UselessFile = require('useless-files
2022-03-01 17:50:52
2889
原创 node.js极简登录注册
user路由里面的代码var express = require('express');var router = express.Router();var path = require('path');var fs = require('fs');/* 登录 */router.post('/login', async (req, res, next) => { var username = req.body.username var password = req.body.p
2021-09-10 11:21:46
171
原创 node.js无数据库，使用express+json形式实现增删改查
借鉴了下面这篇文章，写了自己的express增删改查https://segmentfault.com/a/1190000018087665想使用nodejs（express）搭建一个完整的前后端，完成数据的增删改查，又不想使用数据库，那使用json文件吧。以下node.js使用了淘宝镜像1、先全局安装expresscnpm i express -g2、安装express的脚手架工具express-generatorcnpm i -g express-generator3.
2021-09-09 20:22:00
1352
原创 Vue锚点滚动高亮
data(){ return{ app:'', scrollTop:'', tab:['index','home','about','link'], // 元素的id currentIndex:0 // 记录高亮的位置下标 }}mounted () { this.app = document.querySelector('#app') this.app.addEventListener('scro.
2021-07-22 17:49:44
693
2
原创 Vue设置锚点 url不显示#
<a href="javascript:void(0);" @click="handleTab('index')">首页</a>methods:{ handleTab(id){ document.getElementById(id).scrollIntoView() }}
2021-07-22 17:11:07
410
1
转载 CSS3 圆角梯形导航菜单
HTML<div id='cssmenu'> <ul> <li class='active'><a href='index.html'>Home</a> </li> <li><a href='#'>Products</a> </li> <li><a href='#'>...
2021-07-19 20:04:28
838
转载 「前端进阶」高性能渲染十万条数据(虚拟列表)
https://blog.csdn.net/qq_37818095/article/details/102954854
2021-07-12 17:10:28
72
转载 深入理解http协议的特点
HTTP 是一个属于应用层的面向对象的协议，HTTP 协议一共有五大特点：1、支持客户/服务器模式；2、简单快速；3、灵活；4、无连接；5、无状态。无连接无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接。采用这种方式可以节省传输时间。早期这么做的原因是 HTTP 协议产生于互联网，因此服务器需要处理同时面向全世界数十万、上百万客户端的网页访问，但每个客户端（即浏览器）与服务器之间交换数据的间歇性较大（即传输具有突发性、瞬时性），并且网页浏览的联
2021-07-12 17:09:22
732
转载 JS高频手写代码题
实现 new 方法/** 1.创建一个空对象* 2.链接到原型* 3.绑定this值* 4.返回新对象*/// 第一种实现function createNew() { let obj = {} // 1.创建一个空对象 let constructor = [].shift.call(arguments) // let [constructor,...args] = [...arguments] obj.__proto__ = construc
2021-07-12 17:00:58
111
转载 JS判断客户端是否是iOS或者Android手机移动端
通过判断浏览器的userAgent，用正则来判断手机是否是ios和Android客户端。代码如下：<script type="text/javascript">var u = navigator.userAgent;var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS
2021-07-06 17:53:26
257
转载 VUE路由全局守卫重定向
两个需求：1、用户点击购买需要下单，并跳转到订单页面，但是如果用户没有登录的话，中间有登录验证，会拦截；2、点击购买的时候，登录校验成功了，跳转到订单页面时，订单已创建，去付款即可。3、处理拦截至登录页，然后点去注册页，完善信息页，再回登录页，再登录进去，依然进去目标order页一、解决方案对1： 大概思路：1、当你想进入http://localhost:8080/order(该页面需要登录授权)，2、检查是否登录，如果没有登录就跳转到登录页，需要将上一页的path(‘/order’)作为que.
2021-07-06 17:50:00
2142
转载 css3 背景渐变色实现过渡效果
前言：对于设了渐变颜色的background，css会当做背景图片处理，这时直接设过渡transition会没有效果；整理了两种用过的，给渐变背景加过渡的方法：方法一：利用background-position，通过改变背景位置实现过渡<div class="btn"></div>.btn{ background: linear-gradient(72deg,rgba(5,120,255,1) 0%,rgba(0,177,255,1) 50%,rgba(.
2021-07-06 17:43:04
1430
原创 多行文本溢出显示省略号(…)
单行文本（需要设置宽度）overflow: hidden;text-overflow: ellipsis;white-space: nowrap;多行文本（需要设置宽度）overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;...
2021-07-06 17:38:06
69
转载 vue实现吸顶、锚点和滚动高亮按钮效果
需求滚动页面到顶部，实现某元素固定到顶部效果 点击某个按钮，页面滚动到相应的位置 滚动页面，当到达某个位置时，高亮对应的相关按钮元素吸顶实现方式关于元素吸顶效果，通过查阅相关资料和相关测试，有三种方式（还有一种是jquery的方法，这里就不介绍了）一、使用position:sticky1. 什么是position:sticky?粘性定位元素相当于position:relative和position:sticky的结合体，受限于父级元素，在不同的条件下呈现出不同的页面效果2. 如
2021-07-06 17:35:35
2502
1
转载 css修改滚动条样式
/*修改滚动条样式*/div::-webkit-scrollbar{ width:10px; height:10px; /**/}div::-webkit-scrollbar-track{ background: rgb(239, 239, 239); border-radius:2px;}div::-webkit-scrollbar-thumb{ background: #bfbfbf; border-radius:10px;}div::-webkit-scro.
2021-07-06 17:28:25
56
转载 Vue国际化（vue-i18n）
一、安装三种方式：1、script引入<script src="https://unpkg.com/vue/dist/vue.js"></script><script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>2、npm安装 npm install vue-i18n3、yarn安装 yarn add vue-i18n二、配置main.js.
2021-07-06 17:25:20
224
转载 Vue实现验证码功能
一、创建js组件内容（可直接粘贴过去，需要改宽度和高度，修改_init方法中的宽和高）function GVerify (options) { // 创建一个图形验证码对象，接收options对象为参数 this.options = { // 默认options参数值 id: '', // 容器Id canvasId: 'verifyCanvas', // canvas的ID width: '80', // 默认canvas宽度 height: '30', // 默认ca..
2021-07-06 17:17:19
607
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人