常用的谷歌浏览器插件

浏览器插件

使用谷歌浏览器插件，先安装一个翻墙插件，比如setupVPN

进入应用商店下载插件

常用的php 插件

1. xdebug helper
2. PHP Console
3. xdebug-devtools

常用web插件

• Google 内置的audits
  主要对页面探测，并给出优化参考
  

• Google Page Speed Analyzer网站优化测试

• PageSpeed Insights 网站优化测试

• Page Speed Test Plugin 网站优化测试

• XPath Helper

   xPath helper是一款Chrome浏览器的开发者插件，安装了xPath helper后就能轻松获取HTML元素的xPath，程序员就再也不需要通过搜索html源代码，定位一些id去找到对应的位置去解析网页了。
  

  具体操作：
  1.在chrome浏览器安装好xpath helper插件后，打开某个网页(以搜狐为例)拷贝目标页面元素的XPATH，如下图所示：
  拷贝xpath

2.点击 Ctrl + Shift + X 激活 XPath Helper 的控制台，然后您可以在 Query 文本框中输入相应 XPath 进行调试了，提取的结果将被显示在旁边的 Result 文本框中，如下图所示：
xpath helper解析页面

1。打开一个新的标签，并导航到你最喜欢的网页。

2。按Ctrl-Shift键-X以打开XPath辅助控制台。

3。按住Shift键鼠标在页面上的元素。查询框会不断更新，以显示鼠标指针下面的元素充分XPath查询。结果框其右侧将显示评价结果的查询。
4。如果需要的话，可以直接在控制台编辑XPath查询。在结果框中将立即反映任何变化。
5。再次按Ctrl-Shift键-X关闭控制台

XPath helper插件注意事项

虽然XPath Helper插件使用非常方便，但它也不是万能的，有两个问题：

1.XPath Helper 自动提取的 XPath 都是从根路径开始的，这几乎必然导致 XPath 过长，不利于维护；

2.当提取循环的列表数据时，XPath Helper 是使用的下标来分别提取的列表中的每一条数据，这样并不适合程序批量处理，还是需要人为修改一些类似于*标记等。

不过，合理的使用Xpath，还是能帮我们省下很多时间的！

• .Vue.js devtools：调试vue.js应用的浏览器扩展 Chrome插件
• 网页开发调试工具：JetBrains IDE Support Chrome插件
• JSONView：web开发格式化和高亮插件 Chrome插件
• Emmet LiveStyle：实时高效的CSS编辑器 Chrome插件
• chrome浏览器hosts代理插件：Host Switch Plus