月度归档:2017年03月

decodeURI不能解析的字符有哪些

很久以前踩的一个坑
最近又踩了一次
为了长记性

写下来比较好

地址栏 很多时候 / 斜杠 会被 编码为%2f
然后使用decodeURI进行解码发现没用
此时我开始怀疑人生..
当我一脸懵逼时想到了MDN..

encodeURI 跟 decodeURI 的
保留字有

; , / ? : @ & = + $

不转义字符有
字母 数字 – _ . ! ~ * ‘ ( ) #

然后

encodeURIComponent 跟 decodeURIComponent
保留字有
字母 数字 ( ) . ! ~ * ‘ – 和 _

除了以上这几个字符
其他字符decodeURIComponent都给你转换成原字符

参考链接:
encodeURI()
decodeURI()
encodeURIComponent()
decodeURIComponent()

预览markdown笔记

markdown说明文档

一级标题

二级标题

三级标题

四级标题

五级标题
六级标题

第二种标题

一级标题

二级标题

无序列表

  • 文本1
  • 文本2
  • 文本3

  • 文本1

  • 文本2
  • 文本3

  • 文本1

  • 文本2
  • 文本3

有序列表

  1. 文本1
  2. 文本2
  3. 文本3

列表中加入段落

段落2要隔一行并缩进4个空格/一个制表符
– 段落1

段落2

  1. 段落1

    段落2

列表中加入引用

引用要缩进
* 文本1


> 引用
  • 文本2

列表中加入代码

代码要缩进两次,也就是 8 个空格或是 2 个制表符
* 文本1


    `console.log('代码')`

链接和图片

百度
图片没有时的标题

引用

函数是一等公民

诗的引用

生活不仅有苟且

还有到不了的远方

二级引用

代码的引用

console.log('代码');

console.log('代码');


if(true){
    console.log('一段代码');
}

代码区块

代码要隔一行并缩进4个空格/1个制表符


console.log('代码');

if(true){
    console.log('一段代码');
}

代码区块会一直持续到没有缩进的那一行(或是文件结尾)

表格

表头 第一列 第二列
左对齐 居中 右对齐
左对齐 居中 右对齐
左对齐 居中 右对齐
左对齐 居中 右对齐
左对齐 居中 右对齐

HTML表格

和其他文本用一行隔开

foo

其他文本

代码区块中加入HTML源码

html要缩进4个空格/1个制表符


<div>
    一段HTML源码
</div>

分隔线

第一种


第二种


第三种


行内链接

这是百度的链接

参考式链接

定义一个链接 然后 引用到段落里面
链接可以用<>括起来
链接太长可以把标题换行
标题可以用双引号、单引号、括号

这是引用百度的链接

换行

缩进
2个
空格
按回车

强调

斜体

斜体

粗体

粗体

参考式图片

图片没有时的标题

自动链接

用<>括起来
http://www.baidu.com

反斜杠

反斜杠支持的符号:
\ 反斜线
`反引号
*星号
_底线
{}花括号
[]方括号
()括弧
# 井字号
+加号
-减号
.英文句号
!惊叹号
*带星号的文本*

我使用的是sublime 插件 MarkdownPreview 通过 ctrl + b 生成html代码
参考链接:Sublime插件:Markdown篇

markdown语法笔记

# 一级标题
## 二级标题
### 三级标题
#### 四级标题
##### 五级标题
###### 六级标题

## 第二种标题

一级标题
=

二级标题

## 无序列表
– 文本1
– 文本2
– 文本3

* 文本1
* 文本2
* 文本3

+ 文本1
+ 文本2
+ 文本3

## 有序列表
1. 文本1
2. 文本2
3. 文本3

## 列表中加入段落
段落2要隔一行并缩进4个空格/一个制表符
– 段落1

段落2

1. 段落1

段落2

## 列表中加入引用

引用要缩进
* 文本1

> 引用
* 文本2

## 列表中加入代码
代码要缩进两次,也就是 8 个空格或是 2 个制表符
* 文本1

`console.log(‘代码’)`

## 链接和图片
[百度](www.baidu.com)
![图片没有时的标题](http://stdl.qq.com/stdl/qbextension/update/20160503/chgkpfgnhlojjpjchjcbpbgmdnmfmmil.png)

## 引用
> 函数是一等公民

## 诗的引用
> 生活不仅有苟且

> 还有到不了的远方
>> 二级引用

## 代码的引用
`console.log(‘代码’);`

“console.log(‘代码’);“

“`
if(true){
console.log(‘一段代码’);
}
“`
## 代码区块
代码要隔一行并缩进4个空格/1个制表符

console.log(‘代码’);

if(true){
console.log(‘一段代码’);
}
代码区块会一直持续到没有缩进的那一行(或是文件结尾)

## 表格
|表头|第一列|第二列|
|-|:-:|-:|
|左对齐|居中|右对齐|
|左对齐|居中|右对齐|
|左对齐|居中|右对齐|
|左对齐|居中|右对齐|
|左对齐|居中|右对齐|

## HTML表格
和其他文本用一行隔开

foo

其他文本

## 代码区块中加入HTML源码
html要缩进4个空格/1个制表符

一段HTML源码

## 分隔线
第一种
* * *

第二种
***

第三种
– – –

## 行内链接
这是[百度](www.baidu.com)的链接

## 参考式链接
定义一个链接 然后 引用到段落里面
链接可以用<>括起来
链接太长可以把标题换行
标题可以用双引号、单引号、括号

[引用的id]: www.baidu.com
‘标题’

这是引用[百度][引用的id]的链接

## 换行
缩进
2个
空格
按回车

## 强调
*斜体*

_斜体_

**粗体**

__粗体__

## 参考式图片
![图片没有时的标题][图片的id]

[图片的id]: http://stdl.qq.com/stdl/qbextension/update/20160503/chgkpfgnhlojjpjchjcbpbgmdnmfmmil.png “标题”

## 自动链接
用<>括起来

## 反斜杠
反斜杠支持的符号:
\\ 反斜线
\`反引号
\*星号
\_底线
\{}花括号
\[]方括号
\()括弧
\# 井字号
\+加号
\-减号
\.英文句号
\!惊叹号
\*带星号的文本\*

利用history.pushstate()和window.onpopstate模拟浏览器访问历史

当一个遮罩层覆盖了整个页面时
用户可能会认为这是一个新的页面
所以用户有可能会直接点击返回键
要实现点击返回键关闭遮罩
就可以用以下的方式来实现了

1、利用history.pushstate(状态对象,标题,同源链接);
向浏览器新增一条历史记录
2、当用户点击了浏览器的返回按钮
或者
点击了手机上的 返回键时
通过window.onpopstate 事件句柄 自定义一个函数
就能模拟浏览器的返回动作

注: 手动关闭遮罩时 记得把刚才新增的历史记录删除掉哦
删除上一次的访问历史:history.back(); 或者 history.go(-1);

history.pushState({bar:'lalala'},'这是标题',location.href);

window.onpopstate = function(event){
//do something...
window.onpopstate = null;
$('#J-fixed-box').hide();
}

参考链接:操纵浏览器的历史记录