调试及修改chrome开发人员工具

chrome 开发人员工具是个不错的东西。不过,有时候想改改它,来更好的满足自己的需求。分享一点我自己的收获。
1、chrome开发人员工具的主页:http://code.google.com/intl/zh-CN/chrome/devtools/
2、开发人员工具的源码及chrome浏览器下载:http://commondatastorage.googleapis.com/chromium-browser-continuous/index.html
3、运行办法参考:http://code.google.com/intl/zh-CN/chrome/devtools/docs/contributing.html
最主要几句话:
Go to Chromium continuous builds archive and grab the devtools_frontend.zip archive for a recent revision of Chromium.
Extract the contents of the archive into an empty folder.
Run Chrome with the following command line flag: –debug-devtools-frontend=.
把chrome快捷方式的目标改成类似这样:E:\SOFT\webkit\chromium\chrome-win32\chrome.exe –debug-devtools-frontend=E:\SOFT\webkit\devtools_frontend
后面这个地址是解压devtools_frontend.zip的位置。
这之后,chrome的开发人员工具就会换成你刚下的那个了。
4、浏览器上访问开发人员工具的地址:chrome-devtools://devtools/devtools.html,访问网页,开发这个开发工具,这时还能再在菜单里打开开发工具。
这样就可以用开发人员工具来调试开发人员工具。

另外的调试方式:
1、打开目标网页,如baidu.com
2、在页面上点右键审查元素,调试baidu.com
3、在打开的开发人员工具里点右键审查元素,这样就可以调试第2步中打开的开发人员上人。

另:
如果要确定开发人员工具是否是使用你刚下载的那个,在解压的devtools_frontend/devtools.html中加入自己的几句注释什么的,然后在上面第3步的调试里看第二步打开的工具里有没有这几句注释。如查有,那就是在使有你已经安装的工具了。
呵呵,不错吧。

发表评论

电子邮件地址不会被公开。 必填项已用*标注