为什么我放弃 Gulp 和 Grunt 而使用 npm Scripts

我知道你在想什么。 什么?!Gulp不是刚刚干掉了Grunt吗? 为什么我们不能在Javascript的地盘上消停一会儿呢?我知道,但是…

我发现Gulp和Grunt是没有必要的抽象,npm Script 已经足够强大,并且通常更好用。 继续阅读

用 Chrome 调试 Android 下的页面

用 Chrome 调试 Android 下的页面虽然有点不符合国情,但是还是能解决一些问题的,所以记录一下。

首页在Android(4.0以上)设备上安装Chrome浏览器(版本>=32);

开启当前Android设备的USB调试;

在PC或MAC上安装chrome浏览器(版本>=32)和对应的Android设备驱动(如果找不到,可以在这个 列表 内尝试)

用USB线连接Android设备,在PC或MAC上的chrome地址栏输入 chrome://inspect 然后回车,或通过菜单图标→工具→检查设备,进入调试界面;如图:

DD8E06F3-D4A2-4FAD-A756-8D1652A8611C

勾选界面中的 Discover USB devices ,直到搜索到你的Android设备。

在移动设备上弹出的是否允许远程调试上,选择“允许”

在下面的页面列表(将展示已在Android上的chrome中打开的页面),点击对应的 inspect 开始调试

此时将在桌面版Chrome上弹出一个新的标签页,即为调试界面;如果很久都没用响应,请翻墙后再试

使用console.table()调试javascript

或许你已经习惯了console.log()来调试js,非常使用,但是今天微博看到console.table()调试javascript,和console.log()类似,主要区别在于:

  1. 主要用来输出对象和数组;
  2. 更加直接的可视化,以表格形式展现;
  3. 可以单独输出某个或某几个属性;

详情点击: http://www.mariusschulz.com/2013/11/13/advanced-javascript-debugging-with-consoletable

前端调试利器DebugBar

前端调试工具有很多,比如FireFox firebug, FireFox Web Developer, DOM Inspector,遨游的PageView,IE WebDeveloper V2,还有IE8自带的开发工具 等等,这里我再推荐一个DebugBar;

大家肯定都知道ieTester(点击查看ieTester相关信息),大家都用ieTester来测试各个IE版本的页面兼容性,其实新版的ieTester(点击下载目前最新版的ieTester v0.3.2 )还有一个很强大的页面调试插件:DebugBar。下面来介绍一下功能:

1.DOM:

DebugBar可以分析出所有的DOM,包括图片,样式,脚本等等,

2009-03-27_130604

我们可以通过拖动目标工具(2009-03-27_140246)到页面中寻找需要的目标元素,如图

继续阅读