Chrome控制台$选择器研究

今天在一个QQ群看到Chrome的控制台是支持用$来获取元素的,去试试,果然可以。

用$来进行元素选择是jQuery最常见的用法,那么问题就来了,怎么判断$是来自页面的jQuer.js还是Chrome本身呢?

其实在console输入$之后按enter两个还是有区别的

看下面的对比图片:

 

Chrome控制台$选择器研究_第1张图片

Chrome提供的$

Chrome控制台$选择器研究_第2张图片

jQ的$

其实还有一个区别就是:

通过jQ的$获取到的是一个jQ对象

通过Chrome的$到的是原生的元素对象(Chrome提供的$是调用的querySelector)

 

Chrome控制台$选择器研究_第3张图片

Chrome提供的三种选择器

仔细研究发现一共有三种选择器:

Chrome的$调用的是querySelector()

$$调用的是querySelectorAll();

$x来通过xPath选择元素。

你可能感兴趣的:(前端进化)