风雨后见彩虹

2019年9月2日

摘要： css实现： JS代码一：注：正则表达式\b会把英文缩写，譬如I'm拆分成两个部分，导致输出为I'M,所以不能使用\b JS代码二： JS代码三： JS代码四：注：\b：匹配一个单词边界，也就是指单词和空格间的位置。例如， 'erb' 可以匹配"never" 中的 'er'，但不能匹配 "ver 阅读全文

posted @ 2019-09-02 21:29 风雨后见彩虹阅读(970) 评论(0) 推荐(0) 编辑

『前端积累』web前端代码片段、学习笔记、指令工具整理

摘要： JavaScript Ajax用jsonp方式跨域发送请求示例众所周知，Ajax是通过创建XMLHttpRequest对象或ActiveXObject来连接服务器、发送请求以及响应数据，但它却不能跨域。而在分布式系统中我们又需要跨域发送接受数据，于是jsonp出现了... 它是一种跨域请求方式，主阅读全文

posted @ 2019-09-02 21:06 风雨后见彩虹阅读(1375) 评论(0) 推荐(1) 编辑

2019年8月31日

vue动态子组件的实现方式

摘要：让多个组件使用同一个挂载点，并动态切换，这就是动态组件。通过使用保留的 <component>元素，动态地绑定到它的 is 特性，可以实现动态组件。方式一：局部注册所需组件使用<keep-alive>缓存 <keep-alive> 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 < 阅读全文

posted @ 2019-08-31 20:28 风雨后见彩虹阅读(17116) 评论(2) 推荐(1) 编辑

2019年7月9日

[JS设计模式]：观察者模式(即发布-订阅者模式)（4）

摘要：简介观察者模式又叫发布订阅模式，它定义了对象间的一种一对多的关系，让多个观察者对象同时监听某一个主题对象，当一个对象发生改变时，所有依赖于它的对象都将得到通知。举一个现实生活中的例子，例如小红在淘宝的一家店里看上了一双红色的鞋，小李也在这家店里面看上了一顶黑色的帽子，但是联系卖家时，卖家回答这阅读全文

posted @ 2019-07-09 22:19 风雨后见彩虹阅读(857) 评论(0) 推荐(0) 编辑

2019年6月26日

小tips：TCP的三次握手、长连接、短连接、 SPDY 协议

摘要：当网络通信时采用TCP协议时，在真正的读写操作之前，server与client之间必须建立一个连接，当读写操作完成后，双方不再需要这个连接时它们可以释放这个连接，连接的建立是需要三次握手的，而释放则需要4次挥手，所以说每个连接的建立都是需要资源消耗和时间消耗的。 TCP的三次握手三次握手建立连接：阅读全文

posted @ 2019-06-26 21:47 风雨后见彩虹阅读(771) 评论(0) 推荐(0) 编辑

2019年6月24日

浏览器 DNS缓存与DNS prefetch （DNS预解析）

摘要：浏览器 DNS缓存浏览器DNS缓存的时间跟DNS服务器返回的TTL值无关。注：TTL(Time-To-Live)，就是一条域名解析记录在DNS服务器中的存留时间。浏览器在获取网站域名的实际IP地址后会对其IP进行缓存，减少网络请求的损耗。每种浏览器都有一个固定的DNS缓存时间，其中Chrome 阅读全文

posted @ 2019-06-24 21:51 风雨后见彩虹阅读(3492) 评论(0) 推荐(1) 编辑

2019年5月24日

小tips：在JS语句执行机制涉及的一种基础类型Completion

摘要：看一个如下的例子。在函数 foo 中，使用了一组 try 语句。在 try 中有 return 语句，finally 中的内容还会执行吗？得到的结果是：a 0。根据结果可以看出finally执行了，return语句也生效了。虽然 return 执行了，但是函数并没有立即返回，又执行了 fina 阅读全文

posted @ 2019-05-24 10:22 风雨后见彩虹阅读(1359) 评论(1) 推荐(2) 编辑

2019年5月23日

你可能还不知道的关于JavaScript类型的细节？

摘要：类型七种类型： Undefined Null Boolean String Number Symbol Object Undefined、Null 阅读问题：为什么有的编程规范要求使用void 0 代替undefined？ Undefined类型表示未定义，它的类型只有一个值即undefined，阅读全文

posted @ 2019-05-23 09:31 风雨后见彩虹阅读(627) 评论(0) 推荐(0) 编辑

《JavaScript高级程序设计》笔记：附录A ECMAScript Harmony

摘要：一般性变化常量用const关键字声明常量，声明的变量在初始赋值后，就不能进行修改了，如下代码：块级作用域及其他作用域函数剩余参数与分布参数剩余参数的语法是三个点后跟一个标识符，如下例子：分布参数：可以向函数中传入一个数组，然后数组中的元素会映射到函数的每个参数上。如下代码：以上代码跟阅读全文

posted @ 2019-05-23 09:30 风雨后见彩虹阅读(459) 评论(0) 推荐(0) 编辑

2019年5月7日

《JavaScript高级程序设计》笔记：新兴的API

摘要： requestAnimationFrame() 大多数电脑显示器的刷新频率60HZ，大概相当于每秒钟重绘60次。因此，最平滑动画的最佳循环间隔是1000ms/60，约等于17ms。 mozRequestAnimationFrame() mozRequestAnimationFrame()方法接收一个阅读全文

posted @ 2019-05-07 09:13 风雨后见彩虹阅读(614) 评论(0) 推荐(0) 编辑

2019年5月6日

《JavaScript高级程序设计》笔记：高级技巧

摘要：高级函数安全的类型检测在任何值上调用Object原生的toString()方法，都会返回一个[object NativeConstructorName]格式的字符串。每个类在内部都有一个[[Class]]属性，这个属性就指定了上述字符串中的构造函数名。作用域安全的构造函数作用域安全的构造函数阅读全文

posted @ 2019-05-06 09:41 风雨后见彩虹阅读(1058) 评论(0) 推荐(0) 编辑

2019年4月28日

【笔记】在base命名空间下扩展的属性与方法

摘要：前言该笔记只是为了记录以前开发使用的方式。处理命名空间namespace /** * 处理命名空间 * @param {string} 空间名称，可多个 * @return {object} 对象 */ var namespace = function(){ var argus = argume 阅读全文

posted @ 2019-04-28 10:10 风雨后见彩虹阅读(628) 评论(0) 推荐(0) 编辑

2019年3月22日

webpack4.x笔记-配置基本的前端开发环境（一）

摘要： webpack的基本使用 webpack 本质上是一个打包工具，它会根据代码的内容解析模块依赖，帮助我们把多个模块的代码打包。借用 webpack 官网的图片：虽然webpack4.x的版本可以零配置开始构建，但是在实际的项目中需要其它的一些功能，还是需要一个配置文件。安装下面一步一步讲解配置阅读全文

posted @ 2019-03-22 09:02 风雨后见彩虹阅读(1309) 评论(0) 推荐(3) 编辑

2019年3月18日

vue+原生JavaScript实现slideDown与slideUp[简单思路]

摘要：整个代码如下：参考地址：vue也可以 slidedown 阅读全文

posted @ 2019-03-18 16:11 风雨后见彩虹阅读(4070) 评论(0) 推荐(3) 编辑

使用CSS3的clip-path(裁剪路径)实现剪贴区域的显示以及实例实现图片渐变

摘要： clip-path介绍 clip-path 直译过来就是裁剪路径，使用SVG或形状定义一个HTML元素的可见区域的方法。想象一下你在Photoshop中勾勒路径的场景。MDN上是这样介绍 clip-path的： clip-path属性可以防止部分元素通过定义的剪切区域来显示，仅通过显示的特殊区域。剪阅读全文

posted @ 2019-03-18 11:02 风雨后见彩虹阅读(28304) 评论(1) 推荐(4) 编辑

2019年3月13日

服务器端Session和客户端Session

摘要：客户端Session和服务器端Session 当用户首次与web服务器建立连接的时候，服务器会给用户分发一个SessionID作为标识。SessionID是一个由24个字符组成的随机字符串。用户每次提交页面，浏览器都会把这个SesstionID包含在HTTP头中提交给web服务器，这样web服务器就阅读全文

posted @ 2019-03-13 09:32 风雨后见彩虹阅读(3668) 评论(0) 推荐(1) 编辑

2019年3月5日

《JavaScript高级程序设计》笔记：HTML5脚本编程（16）

摘要：跨文档消息传递跨文档消息传递（cross-document messaging）,有时候简称为XDM，指的是在来自不同域的页面间传递消息。例如，www.wrox.com域中的页面与位于一个内嵌框架中的p2p.wrox.com域中的页面通信。 XDM的核心是postMessage()方法。在HTML 阅读全文

posted @ 2019-03-05 21:50 风雨后见彩虹阅读(425) 评论(0) 推荐(0) 编辑

2019年3月4日

小tips：使用rem+vw实现简单的移动端适配

摘要：首先设置meta属性，如下代码： <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 使用如下代码就能实现移动端的适配： html { font 阅读全文

posted @ 2019-03-04 21:40 风雨后见彩虹阅读(1775) 评论(0) 推荐(1) 编辑

2019年2月27日

《JavaScript高级程序设计》笔记：使用Canvas绘图（15）

摘要：基本用法要使用<canvas>元素，必须先设置其width和height属性，指定可以绘图的区域大小。出现在开始和结束标签中的内容是后备信息，如果浏览器不支持<canvas>元素，就会显示这些信息。如下例子：与其它元素一样，<canvas>元素对应的DOM元素对象也有width和height属性阅读全文

posted @ 2019-02-27 09:25 风雨后见彩虹阅读(1122) 评论(0) 推荐(0) 编辑

2019年1月8日

《JavaScript高级程序设计》笔记：表单脚本（十四）

摘要：表单的基础知识在HTML中，表单是由<form>元素来表示的，而在JS中，表单对应的是HTMLFormElement类型。HTMLFormElement继承了HTMLElement，因而与其它HTML元素具有相同的默认属性。不过HTMLFormElement也有下列独有的属性和方法。 accept 阅读全文

posted @ 2019-01-08 18:01 风雨后见彩虹阅读(709) 评论(0) 推荐(0) 编辑

2019年1月4日

《JavaScript高级程序设计》笔记：事件（十三）

摘要：事件流事件冒泡 IE的事件流叫做事件冒泡，即事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的节点（文档）。如下代码：如果你点击了上面的div元素，那么这个click事件会按照如下顺序传播：（1）<div> （2）<body> （3）<html> （4）document 所有现代浏览阅读全文

posted @ 2019-01-04 17:33 风雨后见彩虹阅读(716) 评论(0) 推荐(0) 编辑

2018年12月25日

《JavaScript高级程序设计》笔记：DOM2和DOM3（十二）

摘要： DOM1级主要定义的是HTML和XML文档的底层结构。DOM2级和DOM3级在这个结构基础上引入了更多的交互能力，也支持更高级的XML特性。为此DOM2级和DOM3级分为了很多的模块（模块直接具有某种关联），分别描述了DOM的某个非常具体的子集。这些模块如下： DOM2级核心：在1级核心基础上构建，阅读全文

posted @ 2018-12-25 17:54 风雨后见彩虹阅读(620) 评论(0) 推荐(0) 编辑

2018年12月24日

《JavaScript高级程序设计》笔记：DOM扩展（十一）

摘要：选择符API querySelector()方法 querySelectorAll()方法 HTML5 与类相关的扩充 1.getElementsByClassName()方法该方法可以通过document对象及所有HTML元素调用该方法。焦点管理 HTML5也添加了辅助管理DOM焦点的功能。首先阅读全文

posted @ 2018-12-24 15:22 风雨后见彩虹阅读(468) 评论(0) 推荐(1) 编辑

2018年12月21日

《JavaScript高级程序设计》笔记：DOM（十）

摘要： Node类型 nodeType以下是一些重要的nodeType的取值：1：元素element2：属性attr3：文本text8：注释comments9：文档document nodeName,nodeValue 节点关系 childNodes: 每个节点都有一个childNodes属性，其阅读全文

posted @ 2018-12-21 17:41 风雨后见彩虹阅读(445) 评论(0) 推荐(0) 编辑

2018年12月20日

《JavaScript高级程序设计》笔记：客户端检测（九）

摘要：能力检测在编写代码之前先检测特定浏览器的能力。例如,脚本在调用某个函数之前，可能要先检测该函数首付存在。这种检测方法将开发人员从考虑具体的浏览器类型和版本中解放出来，让他们把注意力集中到相应的能力是否存在上。能力检测无法精确地检测特定的浏览器和版本。怪癖检测怪癖实际上是浏览器实现中存在的bug 阅读全文

posted @ 2018-12-20 15:38 风雨后见彩虹阅读(422) 评论(0) 推荐(0) 编辑

2018年12月19日

《JavaScript高级程序设计》笔记：BOM（八）

摘要： BOM(浏览器对象模型)提供了很多对象，用于访问浏览器的功能，这些功能与任何网页内容无关。 window对象全局作用域定义全局变量与在window对象上直接定义属性还是有一点差别：全局变量不能通过delete操作符删除，而直接在window对象上的定义的属性可以。窗口关系及框架 window. 阅读全文

posted @ 2018-12-19 19:58 风雨后见彩虹阅读(429) 评论(0) 推荐(0) 编辑

2018年12月17日

《JavaScript高级程序设计》笔记：函数表达式（七）

摘要：递归但是如果代码是在严格模式下开发：结果：Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the argument 阅读全文

posted @ 2018-12-17 09:24 风雨后见彩虹阅读(532) 评论(0) 推荐(0) 编辑

2018年12月12日

《JavaScript高级程序设计》笔记：面向对象的程序设计（六）

摘要：面向对象的语言有一个标志，那就是它们都有类的概念，而通过类可以创建任意多个具有相同属性和方法的对象。理解对象创建自定义对象的最简单的方法就是创建一个Object的实例，然后再为它添加属性和方法。例如：同样上面的例子可以通过对象字面量语法写成如下：属性类型 ECMAScript中有两种属性：数阅读全文

posted @ 2018-12-12 13:27 风雨后见彩虹阅读(480) 评论(0) 推荐(2) 编辑

2018年12月5日

小tips：JS的Truthy和Falsy（真值与假值）

摘要：前言 Truthy 不等于 ture，他是指是在Boolean上下文中转换后的值为真的值。我的理解是，在javascript中所有表达式为true的值。同理Falsy指的是在javascript中所有表达式为false的值。所有值都是真值，除非它们被定义为 falsy (即，除了false，0，“ 阅读全文

posted @ 2018-12-05 09:23 风雨后见彩虹阅读(755) 评论(0) 推荐(0) 编辑

2018年12月3日

footer固定在页面底部的实现方法总结

摘要：方法一：footer高度固定+绝对定位 HTML代码： CSS代码：实现的效果：首先，设置body的高度至少充满整个屏幕，并且body作为footer绝对定位的参考节点；其次，设置main（footer前一个兄弟元素）的padding-bottom值大于等于footer的height值，以保证阅读全文

posted @ 2018-12-03 21:44 风雨后见彩虹阅读(18204) 评论(0) 推荐(4) 编辑

风雨后见彩虹

无论什么时候开始，重要的是不要停止

公告