浏览器的一个妙用——修改京东商品单价显示

前几天，部门的小A找到我，告诉我上次在京东买了东西，找财务处报销的时候遇到了一些问题。因为报销需要商家给的发票和购物截图，而发票上的价格与网页上显示的价格并不相同，于是寻求我的帮助。

一开始我想，用PS或者直接用windows的画图工具，把购物截图涂涂改改也不是什么难事，但这样似乎麻烦且耗时了一些。因为最近常用浏览器调试本地web程序，突然就想到能不能通过浏览器直接修改网页元素呢（因为以前使用浏览器调试的都是本地程序，还没有这样玩过），我想这应当是最简单最根本的方法了。

试了一下，果然可行，只需要简单几步即可。以下面这个页面为例（http://item.jd.com/2150441.html）（此处使用chrome浏览器，现在绝大多数浏览器都有开发者工具）：

1、按F12（或者Ctrl+Shift+l）调用开发者工具

2、点击使用元素选择工具，然后鼠标移至网页栏，停留在需要修改的元素位置，即可在源代码栏看到相应的代码，见下图：

3、双击代码栏相关元素（此处双击￥6999.00），进行修改（此处改为￥7999.00），按回车键（或者单击其他位置）确定，再次按F12退出开发者模式，返回正常浏览模式，再次截图即可。

这样做出来的截图就天衣无缝了，因为根本没有PS过。

如果大家下次碰到同样的问题，不妨用这种方法玩一玩，耗时不过10秒。（突然想到用这种方法修改教务网上的成绩，逗大家乐一乐也是蛮有意思的，哇，全是100分！别骗家长啊。）

转载请保留本文链接：http://www.icoder.top/blog/index.php/2016/09/22/a-interesting-use-of-browser/