Latest posts from iwenli http://blog.wenlis.com/ Sat, 17 Jan 2026 09:22:28 GMT (c) {year} iwenli Moonglade http://blog.wenlis.com/post/2017/2/20/url-encode-special 0x1.前页 前后台传参尤其是ajax异步处理的时候，有些符号在URL中是不能直接传递的，如果要在URL中传递这些特殊符号，那么就要使用他们的编码了。编码的格式为：%加字符的ASCII码，即一个百分号%，后面跟对应字符的ASCII（16进制）码值。例如 空格的编码值是"%20"。 如果不使用转义字符，这些编码就会当URL中定义的特殊字符处理。 0x2.下面整理出来一些URL特殊符号及编码 十六进制值 1. + URL 中+号表示空格 %2B 2. 空格 URL中的空格可以用+号或者编码 %20 3. / 分隔目录和子目录 %2F 4. ? 分隔实际的 URL 和参数 %3F 5. % 指定特殊字符 %25 6. # 表示书签 %23 7. URL 中指定的参数间的分隔符 %26 8. = URL 中指定参数的值 %3D 9. \ 本身转义字符处理为\\即可 0x3.解决办法 … admin@iwenli.org 前端 b5a23115-1d17-4e0c-bea4-c31b0e8f16c8 Mon, 20 Feb 2017 09:28:09 GMT http://blog.wenlis.com/post/2017/2/15/html-head-matekey-detailed 0x1.前页 html head头部分的标签、元素有很多，涉及到浏览器对网页的渲染，SEO 等等，而各个浏览器内核以及各个国内浏览器厂商都有些自己的标签元素,这就造成了很多差异性。移动互联网时代，head 头部结构，移动端的 meta 元素，显得更为重要。了解每个标签的意义，写出满足自己需求的 head 头标签，是本文的目的。本篇以一丝的文章为基础，进行扩展总结介绍常用的 head 中各个标签、元素的意义以及使用场景。 0x2.DOCTYPE DOCTYPE(Document Type)，该声明位于文档中最前面的位置，处于 html 标签之前，此标签告知浏览器文档使用哪种 HTML 或者 XHTML 规范。 DTD(Document Type Definition) 声明以 !DOCTYPE 开始，不区分大小写，前面没有任何内容，如果有其他内容(空格除外)会使浏览器在 IE 下开启怪异模式 … admin@iwenli.org 前端 356a3cec-64e5-4c41-973e-ba6a04080974 Wed, 15 Feb 2017 09:16:13 GMT http://blog.wenlis.com/post/2017/1/3/google-htmlcss-guide 0x1.背景 这篇文章定义了 HTML 和 CSS 的格式和代码规范，旨在提高代码质量和协作效率。 0x2.通用样式规范 0x2.1.协议 省略图片、样式、脚本以及其他媒体文件 URL 的协议部分（http:,https:），除非文件在两种协议下都不可用。这种方案称为 protocol-relative URL，好处是无论你是使用 HTTPS 还是 HTTP 访问页面，浏览器都会以相同的协议请求页面中的资源，同时可以节省一部分字节。 !-- Not recommended -- script src=https://www.google.com/js/gweb/analytics/autotrack.js/script !-- Recommended -- script src=//www.google.com/js/gweb/analytics/autotrack.js/ … admin@iwenli.org 前端 2705d076-9713-488a-808f-1a24f2765511 Tue, 03 Jan 2017 09:07:22 GMT http://blog.wenlis.com/post/2016/12/2/css-bem 0x1.前页 好吧，将 BEM 简单的解释为 “Block-Element-Modifier“， 其实是个不负责任的做法。鬼知道 Block 是什么啊？所以，看了一些似懂非懂的中文解释之后，自己还是得去找些英文来读一读，顺便总结一下。本人对 HTML、JavaScript、CSS 其实都只是一知半解，所以，如果有理解不到位的，还望各位看官斧正。但是，本着“要学就要学最先进”的原则，即使是基础不扎实，还是要冲着更有效率的方式前进。 有不想看我罗嗦的看官，可以直接看下面这篇文档： https://css-tricks.com/bem-101/ 0x2.什么是 BEM 我们借助一个实例，来对 BEM 做一下介绍。下面是一个遵照 BEM 规则写的 CSS： /* Block */ .btn { text-decoration: none; background- … admin@iwenli.org 前端 66f191b2-dd39-4bc7-9180-778ae8985fab Fri, 02 Dec 2016 08:59:58 GMT