Learning & Thinking

“当过去不能照亮未来，人心就在黑暗中徘徊。” 页面：http://jsfiddle.net/calefy/st6KM/embedded/result/

by calefy

HTML

#资源#

* 测试多个浏览器兼容：[Browserstack](http://www.browserstack.com/)，里面包含ie能用到的工具介绍
* HTML5在线幻灯片：http://www.rvl.io/


===================

#杂项#

* [3D俄罗斯方块](http://www.benjoffe.com/code/games/torus)


===================

#好文#

* [前端开发十日谈](http://kb.cnblogs.com/page/159704/) 
* [js、css文件加载事件支持](https://github.com/seajs/seajs/issues/237)
* [js语句分号问题](http://www.zhihu.com/question/20298345)
* [javascript设计模式中文版](http://jayli.github.com/javascript.patterns/)
* [javascript patterns](http://javascriptpatterns.org/)
* [正则表达式](http://deerchao.net/tutorials/regex/regex.htm)


===================

#博客#

* [Jayli github](http://jayli.github.com/blog/index.html)
* [Jayli baidu](http://hi.baidu.com/new/lijing00333)
* [Michael Chen](http://michael.nona.name/)
* [知识库](http://kb.cnblogs.com/)
* [知乎](http://www.zhihu.com/topic)


===================

#需求#

* seajs 文件模块加载
* 新浪评论选中文字弹出浮层
* jsfiddle 编辑器着色， [输入练习](http://typing.io/)
* [jquery通过css3模糊化处理](http://www.oschina.net/news/33847/most-popular-jquery-plugins-of-2012-09)
* 输入框事件及事件执行顺序[输入框事件](http://www.web600.net/html/editor/JavaScript/201001131529.html)
* js异步请求的总结（ajax、jsonp、iframe、动态加载css等）
* String.replace(/.../, '$1'-3)并不能得到计算后的数值,被替换的一直是NaN
* [userData](http://www.lonelyzone.cn/WEBbiancheng/kualiulanqibendicuncu.html)
* 代码编辑器，格式化 + 着色 + vim操作 + 本地存储
* js 中 << 运算原理
* html lang="en" 有时也会导致下划线距离问题
* ？？新消息返回时，数据中的msg属性中的字符串不能直接在console中打出？？
* js文件中直接有语句document.write()不会有任何反应，延时0也会反应

CSS

h1, h2, h3{font-weight:bold;}
h1{font-size:130%;margin:10px 0;}
h2{font-size:120%;margin:6px 0;}
h3{font-size:110%;margin:3px 0;}

ul{list-style-type:circle;margin:8px 0;}
li{margin:3px 0 3px 2em;}

JavaScript

var body = $('body'),
    source = body.html();


/**
 * js 解析markdown语法（简略）
 *    - 因是html，jsfiddle会过滤`<http://some.com>`为`<http some.com="">`
 */
source = source
// 标题（####）
.replace(/(#+)(.*)(?:#+)/g, function(w, p1, p2) {
    var tag = 'h' + p1.length;
    return '<' + tag + '>' + p2 + '</' + tag + '>';
})
// 链接（<url>）
.replace(/\[(.+)\]{1}?\((.+)\){1}?/g, '<a href="$2" target="_blank">$1</a>')
// 列表（*）
.replace(/\* (.+\n)+\n/g, function(w) {
    return '<ul>' + w.replace(/\* (.*)/g, '<li>$1</li>') + '</ul>';
})
// 分割线（====）
.replace(/\={3,}/g, '<hr\/>');


body.html(source);