panshao

html 部分 ``` html alert('script') window.onload = function () { alert('onload') } ``` script.js部分 ``` js alert('defer') ``` 以上代码的alert顺序为`script`, `defer`, `onload` `defer`表示该`script`标签引入的`js`文件并不会修改dom， 在下载过程中是并行下载的，并不会产生阻塞，执行时间是 在`window.onload`函数执行之前执行, 执行时间与jq类似。 **`defer`属性仅当src声明时才有效**

### 其实主要是**h5**新兴的api ###### 几个主要的`api` 1. 后退一页： `history.back()` 2. 前进一页： `history.forword()` 3. 前进或后退n页n 为整数时为前进，负数时为后退 ： `history.go(n)` 4. 得到记录栈中的记录数： `history.length` 5. 获取当前记录的状态： `history.state` 6. 向记录栈中存入记录，类似数组的`push`方法： `history.pushState(state, title, url)` 7. 改变当前地址，但是记录并不会存入栈中： `history.replaceState(state, title,...

以前觉得`JSON.stringify()`只接受一个对象的，后来看`api`时才发现，原来可以接受三个。 `JSON.stringify(value[, replacer[, space]])` 参数一： 必然是一个对象， 必选参数 参数二： 一个过滤函数 ``` js function replacer(key, value) { if (typeof value === "string") { return undefined; } return value; } var foo =...

其实实现多重边框也不是很难， 在外面套一个`div`就可以了。 **但，其实有时候改变页面的结构，会发生很多意想不到的事情，一般不建议用。** 这次介绍俩个属性来实现这一目标 1. `outline` 属性 顾名思义这个属性就是专门添加外边框的， 跟 `border`的属性类似 包含`outline-width`, `outline-style`, `outline-color` 除此之外， `css3` 又新增了一个属性 `outline-offset` 表示偏移值， 可正可负， 举例： ``` css div.outline { width:100px; height: 100px; border: 10px solid...

今天推荐一个热图库， 感觉挺好的。 [官网](http://cal-heatmap.com/) [github地址](https://github.com/wa0x6e/cal-heatmap) 另外附上自己写的一个demo  [具体代码](https://github.com/jackPanyj/blog_demo/tree/gh-pages/cal-heatmap) 具体细节请看代码的[readme](https://github.com/jackPanyj/blog_demo/blob/gh-pages/cal-heatmap/)

``` js // 获取随机的颜色 格式为#ffffff的十六进制数 let color = '' for (; color.length !== 6; color = Math.random().toString(16).substr(2, 6)) ;color = '#' + color // 将十六进制的颜色转换为rgba的格式 function toRGB(color, alpha=1) { if...

``` js 'use strict' let [arr1, arr2] = [[1, 2, 3, 4], [3, 4, 5, 6]] // 获取俩个数组的并集 let union = new Set([...arr1, ...arr2]) console.log([...union]) // 获取俩个数组的交集 let intersect =...

做开发的时候遇到的一个问题 有三种方案： 1. 使用绝对定位，将文字单位飘过去。（由于简单就不概述了） 2. 后面添加一个`span` 将`input`的右边框设置为透明， `span`的左边框设置为 透明 造成连在一起的假象。 3. 也是我采用的方案， 采用伪类元素定位到相应的位置 结构如下 ``` html ``` 由于input不支持`::after`伪类， 所以用一个`span` 包裹住它 `css` 如下： ``` css span { position: relative; } span::after...

感觉发现`ui`给我的图的单选框跟默认的差别好大。 又不能不听他的，没办法只能自己想办法做一个了。 原理： 利用`label`标签跟单选框关联， 隐藏单选框，用`label`的`：：before`模拟一个单选框 `html`代码： ``` html 每日一次 每日多次 ``` scss 代码 ``` scss $blue: #51b8f2; html { box-sizing: border-box; } *, *::before, *::after { box-sizing: inherit; } body...

最近一直在看`css揭秘` 这本书，从中学到了很多，比如今天介绍的用`css`制作棋盘格 用到的知识点： `css渐变， background-size, background-position` 首先看一张效果图  `html` 代码如下： ``` html ``` `css` 代码如下 ``` css .chess { height: 300px; width: 300px; border: 1px solid; background-image: linear-gradient(45deg, #000 25%,...