木有结果~
距离上一篇日志，已经快要两个月了，这大半年里其实也没啥写东西，只不过都写到工作组git去了，性质不变的是依然没有几个人看，尽管像是白用功，但起码我自己会看会用，这也是我给其他新手建议的一点，要多做笔记。这次想写的内容其实很少，接到一个需求是，有个页面是链接点击新开标签页打开，并且页面上要有一个关闭按钮，点击关闭能自动关闭当前页面。……
最近周会部门老大提出一个前端开发的注意事项，就是父页面弹窗出子页面，而子页面需要用到父页面给的数据时，需要保证获得的数据是一次性的，不能因为父页面的其他操作，导致子页面后来拿到的数据有变化或者被覆盖了，这样就有影响了。那时就在想，现有的项目实践上，应该不至于出现这些问题，随后同事又有一个需求需要这么做，来问我，原本他是用localStorage来存储共享的数据，但是父子页面域名不同，导致获取子页面获取不到父页面设置的数据。 于是，我一下子想到好几个办法，不过总得来看，他的需求只是页面子域不同而已，那么公共脚本里已经将domain设置到主域上了，所以其实直接进行frame之间的window是可以互相访问的。 事后，我还是想想有没有其他方法，于是做了一下这次思考的总结。……
2018年第一篇，今天大年初三，回想起来，2017年给自己每个月必须产出一篇日志的目标，在最后一个月失败了，唯一欣慰的是，这一年里写的日志不低于12篇，虽然博客基本没人看，也就自己写着玩，不过记录一下还是好的。……
最近工作需求需要，用到了iframe，由于页面之间没有跨域，所以js写起来还算顺畅，不过在给同事讲postMessage的使用时，遇到了一个使用问题，导致自己以为子页面iframe之间不能通过postMessage通信，只能通过子A传父，父再传子B的形式来实现A和B通信，然而静下心来发现，其实是自己用错了方式。……
这次记录的是，关于扩展程序跨域抓取页面的一个解决方案描述。……
第二次走读fis源码了，带着上一次读源码的笔记，再来读一遍时，有了更好的认识，虽然可能不够全面，但觉得有必要写文章记录一下。……
上回在sf技术圈反馈处看到有用户建议将消息做成桌面通知，这样能方便用户及时查看消息提醒，虽然我不赞成这个做法，不过遇到过几次桌面通知实例，想想应该也不难，不如试着学一下。……
上一篇介绍的是websocket，同时也提到了socket.io，当时学起它时，突然想起可以尝试做个聊天IM的网页，于是上周末捣鼓了两天，瞎设计+逻辑思考+调试修改，总算实现了。……
上一周有空就研究了一下websocket，我记得很久之前有一次面试被问到websocket，不过当时我并不会，只是听说过有这么个东西，知识点太多了，如果说工作上不会用到的话，我并不着急着去学，更何况是比较新的，浏览器支持不是很全面的知识点呢，但是既然最近有空，于是就看了一下。……
我在上一篇日志里用了svg来画图，一改以往画个流程图然后截图上传的方式，一来方便部署，无须上传图床，二来配合css还能展现动图效果。……
平时工作并没有接触到瀑布流，但说起滚动加载，触屏版列表页总会遇到，只是很多时候数据量太少，无暇考虑其存在的优化点，如果被问起，可能回答最多的是图片懒加载吧，但其实不然，也是之前的一次面试，被问及滚动加载的优化，当时面试官很详细的说明需求，那就是页面在不断下拉滚动加载过程中，dom的不断增加会加大内存消耗， 如果是手机的话，会有卡顿的现象出现，这个时候应该怎么处理？……
上次刚写完holmes扩展的分析，这个月的文章还在犯愁，于是动手写了一个扩展，顺便扩充一下chrome扩展开发知识点。……
前阵子在微博看到关于chrome书签搜索的扩展程序Holmes，于是使用了一下，确实还不错，尤其书签多很多的情况下，有个搜索功能 ，比定时做书签分类等等方便得多很多。看着扩展程序功能简单，感觉实现应该不难，于是我就试着查看一下扩展程序源码，也可以顺便进一步了解chrome扩展程序的实现方法和操作api。……
文件上传，是一个挺常见的需求， 一般来说多的是上传图片，或者后台系统做报表上传等操作。……
六月的博文还没挤出来一篇，真是尴尬，之前再想瀑布流的实现和优化，但是卡在中间，就没咋去弄，先整理一下一直没整理的分页生成逻辑吧。……
之前看了 小胡子哥 关于模板引擎原理的博文，对模板引擎有了大致的理解，重新来看这篇文章，又有了点思考。这里我做一下整理。……
写了不少node脚本，虽说不咋复杂，但用的node_module也不少，想想还没自己做过一个npm包发布上去呢，刚好有了个想法：启动apache或者resin来启动本地web服务，虽然可以，但总是离不开各种配置文件，后来学习了koa-static,发现原来写个脚本也就能启动本地web服务，于是开始了koa-static的脚本启动方式，但每换一个目录，要么就是准备多一份脚本要么就是脚本调整一下项目路径，懒癌发作起来，这也是不能忍的，于是想着不如做一个命令行工具，直接通过命令的方式启动服务，那就方便了。（后来加了配置文件来做更多功能）……
在涉及到很多图片的页面，经常是页面显示图片的缩略小图，然后通过鼠标点击，打开浮层，浮层内展示缩略图的原图，这是一个很常见的需求了，之前做过一个组件，主要就是实现这一块的，不过当初在刚拿到需求的时候，还是纠结了一段时间，主要是图片长宽跟浮层长宽之间的关系问题，当时一直没弄懂，碰巧昨天有朋友问起，于是我再找回代码时，又看了一遍。……
五一三天假，眼看快结束了，也没出去人挤人，除了玩游戏，突然想起周五的时候看到sf的一道问题（实际不算问题），题主吐槽出的三道面试前端三年经验的题目，结果能做出来的寥寥无几.……
虽说工作上遇到的跨域解决方案，基本就用着两款，jsonp 或者 工作封装的proxy(实际就是iframe+document.domain)，但免不了经常来了个嵌入页面的需求（跨子域），为了更加快捷的验证一下嵌入页和跨域方案，于是在coding做了个repo。……
以前偶尔听到自动化测试这个概念，但一直对其一头雾水，前端界面主要也就是UI，怎么才能做到自动化呢？还是在跟前同事交流过程中，他提到了nightmare工具。于是就去看了一下，感觉是一款神器，其主要通过编写脚本，运行node来模拟浏览器访问和交互，底层基于electron。可以做到同时打开electron窗口，方便调试跟踪，其api用法比phantomjs更为简单好用！……
同事拿到个设计稿,是旋转木马的轮播效果,于是网上找了一下,发现了jquery实现的效果,一有空就看看源码，研究其实现原理，想着用vue的数据驱动方式来实现一个，但这个效果跟以往做的demo效果不同，每次思考实现都被卡住了。拖延了好些日子，后来脑子一转，居然想到方案了，于是动手实现了下。……
感觉应该坚持一个月至少产出一篇博客文章来， 碰巧在sf看到一个关于bind的问题，又回到去年看过MDN关于bind实现的polyfill，当时看得一脸懵逼，如今对原型链使用有进一步的认识了，于是记一下笔记（原来之前没做笔记）并总结一下。……
最近整理走读了一下webpack产出的模块化代码，于是做一下记录，还没遇到过复杂的情况，只是浅析一下。……
最近博客内容都跟vue有关，但也不是那么深的东西，于是想着用一篇文章来做一个简单的示例合集，比如说抽奖的实现等等。最近弄了两个简单的抽奖，先放上来，后续有新的东西，再整理过来。鉴于demo用jsfiddle来演示了，代码都在上面，我就不贴代码了。……
上次在sf看到一个问题，用vue实现类似淘宝商品图片局部放大的效果，想想自己还没实现过，就尝试了一下，在搜索结果下，看到张鑫旭的一篇博文讲解,大致明白了其原理，于是写个对应的组件尝试一下。……
vue官方为vue项目提供了一个脚手架vue-cli，有了它，很方便的生成一个可用的demo项目，于是在上面进行vue开发可谓得心应手，不用管那么多配置架构。……
2017年的第一篇博客诞生了，虽然又是一个demo，最近学习了下vuex，试着实现一下todo功能。……
继上次react和angular1学习体验之后，隔了四个月，最近有空就入门起了vue2了，其实一开始有稍微看一下的，一开始给我感觉跟angular有点像，而我感觉angular总有那么点复杂感，于是就没继续看，等到vue2出来了，既然有空就学习一下，给我感觉，还是比较轻快简便的一个框架，文档详尽，多到我还没看完，就看了语法那块就开始动手写demo了，也翻查了好些入门内容，遇到不少坑。……
node更新太快了，我在工作上正式用到node的时候，这货还是0.11.0-,现在一看，都7.x了。但是又不能随时升级版本，尤其是当我们用着一些工具如fis，项目用到csssprites时，升级个node分分钟给你warning，可是现在新兴的工具，比如wept微信小程序模拟器，低版本node，不支持。……
以前的博客样式，虽然简洁，但总给自己一种不像技术博客的感觉，通过hyde和小猪的博客，我重新调整了一下博客的构造（样式、布局、css压缩）……
最近在思考怎么用handlebars做模板嵌入？……
前阵子，自己尝试在github上push了自己封装的一个弹窗组件，其实也不全是自己做的，只是照着之前项目用的组件源码重构了一下。……
关于this, 现在应该有很多文章提到了它，它在JavaScript里的作用特别明显，几乎一写到js，基本会用到this了，尤其是面向对象的时候。……
之前花了一个多月时间看jquery2的代码，真的复杂，一些逻辑实现做了代码复用而失去可读性，读起来真的累。……
在一次面试中，对方问了我一个问题，jquery的jsonp，怎么处理异常的？（大致意思吧）……
最近做触屏版，刚好在本地环境复现一下测试提的bug。……
上次学着用react写了一个url收藏简单功能。这次照着这个需求，用angular1来实践一下。……
自学了一下react，这次以做一个简易的链接收藏增删改查操作为目的推动。……
刚接触fis2的时候，就已经出fis3了，不过项目都是用fis2做的，也不熟悉，也就没想过迁移的事。趁着空闲，刷了下fis2的源码，再学习一下fis3，开始针对着项目打算做一下fis3的迁移尝试。……
2016年第一篇小博文，刚push上去，就收到github的邮件，说是下个月初开始github page就开始升级到jekyll3了，说我的_config.xml配置得改了。……
一年多都在用fis，第一次看fis项目里模块化的具体实现方式……
刚记录了下grunt,少不了gulp。……
平时项目要么用ant，要么用fis来自动化构建项目.……
无意间打开了 JSRobot.……
终于开始折腾怎么ssh连接虚拟机了。……
看到H在微博转发的关于学习nodejs的活动，于是果断报名了;(由于报名反馈比较晚，我报了两次，囧)地点是在大学城某产业区，结果由于太过聪明，走错了地方，还好还有四个小伙伴跟我一样走错（一个看起来皮肤白有点锻炼的小伙，刚毕业出来工作，还有两个还在读大二，啊，人生），本来是两点开始的，结果我们到了两点二十分才意识到是我们走错地方了。……
端午三天小长假，麻麻回家，今天就宅在家继续折腾sf的小伙伴说，elementary os很好看，我就去试用了一下，确实不错，也够折腾的。现在是折腾纪实，最后再来个os见面印象。问题1：输入法不能用。我觉得应该是因为我安装os的时候选择了美版键旁布局，导致系统不做中文翻译，而ibus的右键preference也不给选择了，卸载重装ibus也没用，最后是系统设置那里更新了中文语言支持，之后才可以了，不过似乎在不需要选择中文支持，不然会使得控制台显示乱码.终于可以输入中文了，这里有一个问题，就是关于ibus设置，在语言支持那里选择应用了中文之后似乎就出现了编码乱码问题，重新取消掉中文就可以了。……
12345678910111213141516171819202122 var scrollDiv = document.getElementById("divScroll"); var divContent = document.getElementById("divContent"); var marginTop = 0; scrollDiv.addEventListener("mousewheel", function(e){ //console.log(e.detail); //console.log(e.wheelDelta); if(e.wheelDelta>0){ if(marginTop==0){ return; } marginTop+=10; }else{ /* console.log(marginTop); console.log(scrollDiv.offsetHeight-420);*/ if(marginTop+scrollDiv.offsetHeight<divContent.offsetHeight){ return; } marginTop-=10; } scrollDiv.style["margin-top"] = marginTop+"px"; }); ……
最近在网页上实现微信界面的研究，遇到了框内内容过多溢出，需要下拉的效果.于是就研究了下 下拉实现 一般传统的做法，就是给父元素加上 overflow:scroll,但是这样就会出现滚动条，尽管有的说可以不要滚动条，不过我看到的是只有在设置body处，才有说滚动条隐藏但照样能滚动，于是因为我要的是div里面的内容滚动,就继续找找看，终于看到了微博的嵌入框功能(代码嵌入到其他网站，访问网站时会显示微博的框和内容),里面虽然也有滚动条，但那个是用div做的。 所以，我学到的做法是: 父元素div设置overflow:hidden，来剪切掉子元素内容过长溢出问题;父元素需要有固定的高度。 子元素加入margin-top属性配置，当属性值为负时，子元素的内容实际上是上移了，而且上移的部分又被父元素的hidden屏蔽了，上移的尾部内容又接下展示在父元素底部内。 所以接下去的步骤，就是实现鼠标滚动事件来控制子元素的margin-top:……
鉴于与朋友提到用github展示网页，而无需自己去租服务器。 这里就简单介绍一下如何，配置出自己的github page；其实自己也是网上google的，所以也不细讲，简单描述一下步骤，并记录一下，当初操作的时候自己产生的一些疑问。……
google到ukulele谱时，发现一豆瓣青年把谱子都放到豆瓣相册了，一百多张，每个点击去看大图再另存为太累了，所以我就现学现用，花了两个周末，用python来爬图，由于豆瓣不需要登录，图片库也不算难扒图。……
1.首先要有github账号。注册省略。 - 建立库：github提供两种pages模式，都是按 username.github.io来访问 ，一种是建立名为username.github.io的repo，另一种则是其他repo的setting处，选择自动创建页面（实际是用来做项目页面介绍的，会在项目建立gh-pages分支，所以自动创建出来的页面是以username.github.io/repo_name来访问的，） - git知识：常用命令……
费了几天劲，才比较正常的弄出个能见人的博客页面来，真是不容易啊，为了简洁也好。……