内置 jQuery 的 Chrome 浏览器开发工具？

早上思考到一个问题，为什么Chrome的devtool中"$"一直可以执行，即使页面没有jQuery脚本。难道内置了jQuery？本着寻根究底的原则，好好研究了一下。

我们在Chrome控制台中进行的操作其实是调用了 Chrome Command Line API。这个API主要完成选择和检查DOM元素，显示数据，执行函数以及监控DOM事件等任务。需要注意的是，这个API只能通过Chrome控制台调用，不能通过网页的脚本调用。

了解到这里，大家就明白了在控制台中用$查找元素和页面一毛钱关系也没有，也不是jQuery的选择器。顺便介绍一下 Chrome Command Line API有哪些接口。

• $(selector)
  返回带有指定的 CSS 选择器的第一个 DOM 元素的引用。此函数等同于 document.querySelector() 函数。$是Chrome定义的一个别名，实际就是document.querySelector()。

注意: 如果页面中使用了jQuery或者其他脚本对 $ 进行了重写，那么 $ 会被覆盖。执行的结果将是jQuery或其他脚本的结果。

• $$(selector)
  返回与给定 CSS 选择器匹配的元素数组。此命令等同于调用 document.querySelectorAll()。

• $x(xpath)
  返回一个与给定 XPath 表达式匹配的 DOM 元素数组。

• clear()
  清除其历史记录的控制台。

• copy(object)
  将指定对象的字符串表示形式复制到剪贴板。

• $_
  返回最近评估的表达式的值。
  

  

Chrome Command Line API支持的方法还有很多，Chrome开发者工具也是一个很强大的工具。更多信息请参考https://developers.google.com/web/tools/chrome-devtools/console/command-line-reference