- 博客(74)
- 收藏
- 关注
RSS订阅原创 前端跨域问题
1.nginx遇到的坑确保你启动的nginx服务和你前端项目工程启的端口不冲突，然后要在修改本地的host文件，C:\Windows\System32\drivers\etc，加上127.0.0.1:8080（本地工程ip和端口号） linxiaohui.hqjy.com（你的域名，和nginx启动的域名一样，只是端口号不一样）1.2nginx: [emerg] unknown directive "锘? in D:\nginx-1.12.2/conf/nginx.conf:3问题：当时
2024-05-13 15:34:38
967
1
原创 vue 鼠标移入移出事件执行多次(尤其ie)
<p @mouseover="over($event)" @mouseout="out($event)">互相关注</p>out (t) { t.target.innerText = '互相关注'},over (t) { console.log(t, 1) console.log(t.target.innerText, 1) t.target.innerText = '取消关注'},不能这么写，这么写的话ie10点击取消关注会卡死，应为mouseove
2023-11-20 17:22:51
653
原创 新版本通知，判断资源是否存在，flv协议资源无法中断处理，vue3响应式，git revert，面包屑，flex-basic与width，vite热更新失效
日常踩坑
2022-10-17 08:23:49
304
1
原创 你不知道的ES6-语法的用途
函数尾调用、proxy和reflect、symbol、promise、Iterater 和for…of1.函数尾调用指某个函数的最后一步是调用另一个函数。function f(x){ return g(x);}尾递归函数调用自身，称为递归。如果尾调用自身，就称为尾递归。递归非常耗费内存，因为需要同时保存成千上百个调用帧，很容易发生“栈溢出”错误（stack overflow）。但对于尾递归来说，由于只存在一个调用帧，所以永远不会发生“栈溢出”错误。function factorial(
2022-04-09 22:34:39
2073
原创 vue 流星的样式和流光canvas
最近研究了一下公司高级写的流星的代码，发现挺好玩的，先上代码，后再分开解构样式：<template> <div class="index"> <div class="star" style="top: 0px;left: 500px;"></div> </div></template><script>import { getUrlPara } from '@/utils/factory'import
2022-03-25 15:14:37
2014
2
原创 前端性能优化、二进制、流（Stream）、缓冲区（Buffer）、图片文件转Base64，Base64转Blob，Blob转File对象、js和css与dom执行关系、游览器进程、woker、new
一、前端性能优化1.http从页面请求一个页面地址到返回看到全部数据的优化：强缓存/协商缓存、减少/合并请求数量、带宽、cdn的域名不同页面访问域名2.资源大小Js/css/html合并压缩3.优化图片雪碧图：优点减少请求，缺点图片资源过大，jpg有损压缩，压缩率大，没有图片透明，png兼容性好，可以图片透明，webp在ios和webview存在兼容性问题，svg矢量图，内嵌代码。4.Css/js加载和执行css写在head，js写在body（后面说为什么）注意：GUI 渲染线程为什么与
2022-02-12 18:00:11
2315
2
原创 12月19号-12月26号：一些css、游览器拦截跳转窗口、HTML文件解析、postMessage
一、CSS1.基础选择器：标签选择器：选的啥一类标签，无论嵌套有多深类选择器：类名开头不能是数字和中划线，跨域由数字、字幕、下划线、中划线组成，类名可以重复，多个空格空格隔开id选择器：不可重复，一个页签只能写一个id属性值，一个id选择器只能选择一个标签通配符选择器：给所有标签设置样式2.字体：font-family：左到右查找，电脑没有这个字体久显示下一个字体3.line-height:行高减除文字高度，均分分上下间距，常见场景1:设置单行文本垂直居中，多行文本不能设置垂直居中2.取
2021-12-27 09:34:16
517
原创 12月13号-12月18号:排序算法、VUE生命周期详解、关于断点续传和秒传上传、js图片懒加载实现、微信分享链接变成了网址形式问题、Boostate
一、排序算法1.归并排序排序一个数组，我们先把数组从中间分成前后两部分，然后对前后两部分分别排序，再将排好序的两部分合并在一起，这样整个数组就都有序了。归并排序采用的是分治思想。分治，顾名思义，就是分而治之，将一个大问题分解成小的子问题来解决。小的子问题解决了，大问题也就解决了。const mergeSort = arr => { //采用自上而下的递归方法 const len = arr.length; if (len < 2) { return arr;
2021-12-20 14:38:18
515
原创 12月6号-12月12号:动态库gsap、视觉差parallax-js、手势库hammerjs、打字库typed、多页签通信、xss和csrq、axios获取上传文件进度、多入口打包\
这周是来这里最忙的一周，周一请假一天，周二来了突然说周五要上线一个复杂的h5活动；手头还有pc和h5双十一要上线，杂乱的一周，最后还是按时上线了；又复杂又杂的一周，react和vue的增查改的不同，react偏向原生的js写法，vue有v-modal双向数据绑定功能，所以vue的增查改就一个v-modal，而react就要三个方法类，还望大家注意~~，来说说这周用到的库吧，动态库gsap，手势库parallax-js，打字库typed，一、gsapgsap用来过渡数字和动态样式：有动态完成的方法，很方便
2021-12-13 16:47:51
1659
2
原创 11月22-11月28总结，pc端适配、uniapp小程序下载三种情况、原型、继承、好用的函数、计算机组成原理、小程序和游览器的线程区别、深入vue、发布订阅模式与观察者模式
pc端适配注意：要知道移动端文字最小只能去到10像素，pc端大多只能去到12像素1.zoom整体缩放，火狐支持较低2.transform：scale（）整体放大缩小，ie9以下不支持3.监听窗口大小变化，px转rem，可能出现文字掉下第二行3.媒体查询，是完美适配，但是代码量会比较多...
2021-11-29 15:48:23
324
原创 20211115-20211121：less和sass的区别；作用域；回流重绘；this指向；小程序学习
一、预编译样式比css样式更强大，变量、嵌套、运算,混入(Mixin)、继承、颜色处理，函数less和sass的区别变量符：sass$,less@less存在块级作用域，sass是全局作用域条件语句：sass支持ifelse，for；less不支持文件引用：Scss引用的外部文件命名必须以_开头，@import “_test1.scss”;；less和普通css一样二、作用域：1.注意：所有末定义直接赋值的变量自动声明为拥有全局作用域 function outFun2() { v
2021-11-22 10:15:21
670
原创 解决前端精度问题，js写和number-precision库
学过前端的开发人员在项目开发的时候，都会遇到 0.1+0.2!=0.3 的诡异问题。按照常规的逻辑来思考，这肯定是不符合我们的数学规范。那么JavaScript中为啥会出现这种基本运算错误呢，其中的原理又是什么。这篇文章将从原理给大家梳理此问题的缘由计算机中的二进制接下来进入正文，学过计算机基础的人都知道，计算机底层是通过二进制来进行数据之间的交互的。其中我们应该要明白为什么计算机通过二进制来进行数据交互，以及二进制是什么计算机为什么要通过二进制来进行数据交互？在我们日常使用的电子计算机中，数字电
2021-11-12 16:34:02
2358
原创 活动页倒计时-worker-loader
一、无阻塞问题的方案：npm install worker-loader --save-devwebpack{ test: /\.worker\.(c|m)?js$/i, loader: "worker-loader", options: { esModule: false, }, },App.vue<template> <div id="button"> {{remainTimestamp}} </div>
2021-11-08 11:57:03
472
原创 年会抽奖活动-随机抽
效果图：代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <!-- 引入样式 --> <link rel="s
2021-10-30 11:42:04
489
原创 node 写下载接口， 前端接受文件流下载
nodevar http = require('http');var express = require('express');var fs=require("fs");var app = express();app.get('/download/*', function (req, res, next) { //第一种方式 //var f="F:/ftproot/NW.js.docx"; //var f="f:/ftproot/我是中文的语言.txt" ////var f =
2021-10-29 16:30:24
904
原创 vscode的settings.json最新配置
{ // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #每次保存的时候自动格式化 "editor.formatOnSave": true, // #每次保存的时候将代码按eslint格式进行修复,vscode es6语法检测配置 "editor.codeActionsOnSave
2021-10-28 10:30:20
496
原创 请说说什么是BFC
BFC到底是什么东西BFC 全称：Block Formatting Context， 名为 “块级格式化上下文”。W3C：BFC是页面中的一块渲染区域，并且有一套渲染规则，它决定了其子元素将如何定位，以及和其他元素的关系、相互作用；简单来说就是，BFC是一个完全独立的空间（布局环境），让空间里的子元素不会影响到外面的布局。那么怎么使用BFC呢，BFC可以看做是一个CSS元素属性怎样触发BFCoverflow: hiddenposition: absoluteposition: fixeddi
2021-09-27 11:58:23
90
原创 vue深入响应式原理
一.追踪变化：当一个普通的对象设置入data时，vue会遍历该对象，使用Object.defineProperty，把对象的属性设置getter/setter，每个组件实例对应一个watcher实例，当触发依赖项的setter，触发对应的watcher，从而使得它的组件重新渲染。二.检测变化的注意事项1.对象：无法监控对象的属性的新增和删除，解决：this.set(this.obj,key,value),对象合并，Object.assign(),...扩展运算符2.数组：无法设置数组的某个项的值：th
2021-09-13 20:53:38
76
原创 前端滚动的方法（无兼容性问题）
1.最佳方法（vue）兼容性好document.documentElement.scrollTop = num;// 锚点跳转 async goScroll(anchor) { let target = document.getElementById(anchor); let currentTop = document.documentElement.scrollTop; let targetTop = target.offsetTop - 200;
2021-09-13 19:34:48
180
原创 关于PC端游览器生成唯一标识
~~在图解http第一章说明，网络通信必须要同时知道IP地址和mac地址，ip地址可以获取到，关于mac地址就呵呵了一，关于IP地址：1.1IP地址编址方式ABC类ip地址规则：网络号+主机号生存，如下图1.2ip工作过程数据包传送的关键是将目标节点的IP地址映射到中间节点的MAC地址1.3搜狐获取ip地址<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script><script type="tex
2021-09-06 14:27:44
1675
原创 了解web及网络基础
网络基础TCP/IP(IIP协议不是IP地址)1.3.2 TCP/IP 的分层管理是在 TCP/IP 协议族的基础上运作 的，而 HTTP 属于它内部的一个子集；互联网相关联的协议集合起来总称为 TCP/IP；TCP/IP 的分层管理：应用层、传输层、网络层和数据链路层。层次化之后，设计也变得相对简单了。应用层：向用户提供应用服务时通信的活动，dns,http传输层：提供处于网络连接中的两台计算机之间的数据 传输。TCP，udp网络层：网络层用来处理在网络上流动的数据包。该层规定了通过怎样的路径（
2021-09-04 21:09:41
128
原创 简单的http协议
将针对 HTTP 协议结构进行讲解，主要使用HTTP/1.1版本。学完 这章，想必大家就能理解 HTTP 协议的基础了2.1 HTTP 协议用于客户端和服务器端之间 的通信 HTTP 协议和 TCP/IP 协议族内的其他众多的协议相同，用于客户端和 服务器之间的通信。 请求访问文本或图像等资源的一端称为客户端，而提供资源响应的一 端称为服务器端下面，我们来看一个具体的示例。下面则是从客户端发送给某个 HTTP 服务器端的请求报文中的内容。GET /index.htm HTTP/1.1 Host
2021-09-04 20:56:36
42
原创 用JavaScript原生手写div的鼠标拖拽功能
一、三个事件onmousedown（鼠标按下），onmousemove（鼠标移动），onmouseup（鼠标松）鼠标按下时box.onmousedown = function(e) { console.log("e.clientX",box.offsetLeft); console.log("e.clientY",box.offsetTop); var e = e || window.event; //要用event这个对象来获取鼠标的位置 x = e.clientX - box.offs.
2021-08-26 17:01:11
186
原创 唤醒淘宝app并跳转对应的商品详情页面
跳转测试地址：taobao://m.tb.cn/h.4Ab8FZy?sm=7ad5e7function loadURL(url) { var iFrame; var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端 var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X.
2021-08-07 18:00:55
3152
2
原创 H5和PC端setTimeOut定时器时间不准
在h5手机端时间不准的时候：监听事件visibilitychange重新更新时间 // 防止息屏后计时器停止，开启后刷新页面 let _this = this document.addEventListener('visibilitychange',function() { if(document.visibilityState=='visible') { _this.getLuckDraw() } })在pc手机端时间不准的时候：
2021-08-07 15:28:25
288
原创 nuxt动态路由和设置别名
在nuxtconfig.js里面router配置router: { mode: "history", extendRoutes(routes, resolve) { let newRouter = []; // 路由别名 aliasList.map((item) => { const index = routes.findIndex(route => ''+route.name === ''+item.name) .
2021-07-29 09:53:05
1692
原创 vue的$ref写内联样式，标签和组件的区别
1.如果是你在某个组件写内容样式比如：此时，写样式的时候，必须加上el打印的结果，el
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人