前端
关注
分享
扫一扫
你的微笑像拥抱
这个作者很懒，什么都没留下…
展开
-
react hook 简易实现
摘自：自顶向下学 React 源码<!DOCTYPE html><html lang="en"><head> <title>React App</title></head><body> <div id="root1"></div> <div id="root2"></div> <div id="a"> &原创 2021-06-14 23:41:18 · 394 阅读 · 3 评论 -
手机号、银行卡号 格式化 加空格 每四位一空格
xxxxxxxx.replace(/\s/g,'').replace(/(\d{4})(?=\d)/g,"$1 ")原创 2020-04-22 15:44:10 · 906 阅读 · 0 评论 -
跨域 post 请求 set cookie 无效
// 需要加这个字段xhrFields:{ withCredentials: true },原创 2020-04-16 15:42:04 · 993 阅读 · 0 评论 -
LeetCode 703. 数据流中的第K大元素 JavaScript
/** * 通过 * @param {number} k * @param {number[]} nums */function swap(arr, i, j) { [arr[i], arr[j]] = [arr[j], arr[i]];}// 调整堆function heapify(arr, len, i) { while (true) { if...原创 2020-04-12 14:24:38 · 308 阅读 · 0 评论 -
JS判断客户端是否是iOS或者Android
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/); //ios终端alert('是否是Android：'+i...原创 2020-03-24 10:41:11 · 225 阅读 · 0 评论 -
js 手写 Object.is
Object在严格等于的基础上修复了一些特殊情况下的失误，具体来说就是+0和-0，NaN和NaN。function is(x, y) { if (x === y) { //运行到1/x === 1/y的时候x和y都为0，但是1/+0 = +Infinity， 1/-0 = -Infinity, 是不一样的 return x !== 0 || y !== 0...原创 2020-03-04 21:40:12 · 498 阅读 · 0 评论 -
js 手写 instanceof
function myInstanceof(left, right) { if(typeof left !== 'object' || left == null) { return false } let proto = Object.getPrototypeOf(left); while(proto) { if(proto === ...原创 2020-03-04 21:22:36 · 525 阅读 · 0 评论 -
css 实现 三角形 梯形
在线调试<!DOCTYPE html><html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title> <style> div { width: 0; height: 0; border-width: 1...原创 2020-02-23 20:53:13 · 289 阅读 · 0 评论 -
js 手写 call apply bind
calllet obj = { name: 'xxx'}function sayName(prev) { console.log(prev, this.name)}Function.prototype.myCall = function (context) { context = context || window; let args = [...ar...原创 2020-02-23 20:22:16 · 476 阅读 · 0 评论 -
js 对象模拟 DOM 树 实现 render 方法 调用 render 方法将 js 对象转真正的 DOM 节点
var ul = el('ul', { id: 'list' }, [ el('li', { class: 'item' }, ['item 1']), el('li', { class: 'item' }, ['item 2']), el('li', { class: 'item' }, ['item 3']),])var ulRoot = ul.render();...原创 2020-02-23 15:15:06 · 894 阅读 · 0 评论 -
js 手写 es6 模板字符串
// ES6 模板字符串let name = "小明";let age = 24;let temp = "hello, 我是 ${ name }, 今年 ${ age} 岁了, 五年以后我 ${age+5} 岁。";function fn(str) { console.log(str) return str.replace(/\$\{(.*?)\}/g, f...原创 2020-02-22 21:35:41 · 897 阅读 · 1 评论 -
base64相关
Base64图片编码原理：Base64编码要求把3个8位字节（38=24）转化为4个6位的字节（46=24），之后在6位的前面补两个0，形成8位一个字节的形式。 如果剩下的字符不足3个字节，则用0填充，输出字符使用’=’，因此编码后输出的文本末尾可能会出现1或2个’=’http://gj.3gwen.com/tpbase64.html?kbl=base64 里为什么需要每个 6 位二进制需要...原创 2020-02-16 22:30:22 · 172 阅读 · 0 评论 -
nginx 反向代理和简单的负载均衡算法
nginx 反向代理和简单的负载均衡算法nginx 安装 （MAC）// 命令行终端运行/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"// 安装 nginxbrew install nginx// 运行 nginxnginx配...原创 2020-01-09 23:21:27 · 219 阅读 · 0 评论 -
抓包分析 https 密钥协商流程
抓包分析 https 密钥协商流程工具：Wireshark 2.6.6抓取链接：https://220.181.38.150 (*度地址)本机地址：100.81.137.224刚开始分析不知道TLS协议的会话缓存机制，百度使用了会话缓存的这种机制来加速https握手的速度！客户端使用要恢复的会话的会话ID发送“客户端问候”消息。服务器检查其会话缓存中是否有匹配的会话ID。...原创 2020-01-09 22:35:05 · 2300 阅读 · 1 评论 -
知识点 : session + 持久化
前面是瞎扯，代码在后面。前言http 请求是无状态的，什么是无状态呢，就是你先后向服务器发送两个请求，服务器那边比较糊涂，自己是没有办法识别这两个请求是否是同一个用户发送来的。也就是说，我上一秒给你五毛钱你下一秒就不认账的意思。为了避免这种情况发生，我们告诉服务器，对岸的朋友来的时候，你给他一个签名，告诉他，下次带着签名过来，确认一下是不是对的人。当然，这个签名也是有 有效期 的。...原创 2020-01-09 22:51:38 · 1903 阅读 · 1 评论 -
Css Hack
Hack:针对不同的浏览器写不同的css样式的过程，就叫CSS Hack;\9 所有的IE10及之前，因为当时没有IE10，后来出现IE10经测试发现也管用。+* IE7及以下的IE浏览器认识 +、、+_ IE6及以下版本浏览器Hack ，不是太标准的一件事情，远离CSS Hack，有益身心健康，不到万不得已的时候尽量不去使用Hack。新手上路，欢迎反驳！原创 2017-02-17 14:41:51 · 276 阅读 · 0 评论 -
IE5、6下绝对定位元素和浮动元素并列，绝对定位元素消失不见解决方案
浮动元素和绝对定位元素是同级的话，绝对定位元素就会消失，所以咱们只要让他们两个不处于同级就可以避免这个BUG<!DOCTYPE html>原创 2017-02-17 14:16:07 · 988 阅读 · 0 评论 -
IE6下绝对定位元素存在1px偏差问题
小知识：IE6下面绝对定位元素父级的宽高是奇数，绝对定位元素 设置 right:0;bottom:0; 在IE6中会有1px的偏差。解决方案： 避免父级宽高出现奇数。代码：原创 2017-02-17 10:32:12 · 587 阅读 · 0 评论 -
IE6、7下父元素overflow:hidden;包不住子元素解决方案
在IE6、7下面父元素包一个设置了相对定位的子元素，设置overflow:hidden;应该超出部分隐藏的，但实时并不是这样 。代码：原创 2017-02-17 09:37:44 · 594 阅读 · 1 评论 -
文字溢出，IE5、6下导致多复制文字的解决方法（文字小尾巴解决方案）
在IE5、6下面，两个浮动元素之间存在注释或者有内联元素，并且这两个元素的和父级宽度相差不超过3px，就会导致文字溢出bug会多复制文字。原创 2017-02-17 09:24:12 · 667 阅读 · 0 评论 -
li下方存在间距空隙解决方案
li里面有元素且元素都浮动的情况下，li在IE6、7下会产生4px间隙问题。解决方案： 针对 IE6、7添加*vertical-align: top;原创 2017-02-17 08:57:28 · 1286 阅读 · 0 评论 -
元素双边距解决方案
IE6、7下当元素浮动后在设置margin就会产生双边距，解决方案：针对IE6、7设置*display:inline; 遇到双边距情况的猿友们可以试一下。原创 2017-02-17 08:44:39 · 468 阅读 · 0 评论 -
IE5/IE6下最小高度问题
IE5和IE6下 元素最小高度解决方案原创 2017-02-17 08:28:24 · 874 阅读 · 0 评论 -
IE6IE7不支持inline-block解决方法
解决方法： *display:inline; *zoom:1; zoom是IE专有的，它可以设置或检索对象的缩放比例。除此之外，它还有其他一些小作用，比如触发ie的hasLayout属性等。但很遗憾的是，它通不过W3C验证。原创 2017-02-16 21:54:50 · 677 阅读 · 0 评论 -
IE8以下不支持H5新标签的解决方案
猿友们再写页面的时候，* * 客户可能要求兼容IE8以下版本，可是你用了几个H5的新标签，在IE8以下完全不识别怎么办呢。这时，不要慌不要忙，跟我一起念：如意如意随我心意快快显灵快快显灵 ，哈哈哈教大家个简单的方法直接通过JS创建相同名字的标签就可以了。下面直接撸代码：原创 2017-02-16 21:14:45 · 5287 阅读 · 0 评论 -
img （内联元素） （inline元素） 标签上下左右间隙问题原因及解决方案： 垂直方向间隙和水平方向间隙原因及解决方案：
img （内联元素） （inline元素） 标签上下左右间隙问题原因及解决方案：垂直方向间隙和水平方向间隙原因及解决方案：1. 我们先来看左右间隙的原因和解决方案，最后讲解上下间隙的原因及解决方案。产生左右间隙的原因： 大家看图 根据W3C规定，JavaScript种的DOM元素的类型有12种，在这里img是节点元素，而他们之间的换行符则是一个文本元素，文本元素根据字体大小来占位，字体越原创 2017-02-15 08:58:29 · 5087 阅读 · 0 评论 -
vue路由参数可选 参数可有可无
参数后面使用 ？ id 后面加个 ‘ ? ’ ，将 id 设置为可选参数{ name: "index", path: '/p/:id?', component: resolve =>void(require(['../components/admin/layout/index.vue'], resolve))}// =={ path: '/p/:id?',原创 2018-02-01 15:29:39 · 9935 阅读 · 1 评论 -
TCP 三次握手
三次握手SYN (同步序列编号)：是 TCP/IP 建立连接时使用的握手信号。TCP 连接的第一个包，非常小的一种数据包。在客户机和服务器之间建立正常的 TCP 网络连接时，客户机首先发出一个 SYN 消息，服务器使用 SYN + ACK 应答表示接收到了这个消息，最后客户机再以 ACK 消息响应。这样在客户机和服务器之间才能建立起可靠的 TCP 连接，数据才可以在客户机和服务器之间传递...原创 2018-07-16 15:52:42 · 1380 阅读 · 1 评论 -
样式优先级CSS优先级CSS样式权重
样式优先级原创 2017-02-17 14:53:40 · 699 阅读 · 0 评论