问题 Chrome等效的Firefox Firebug CSS选择路径


我已经转向Chrome,但“Firebug lite”最烦人的功能之一就是它不允许你复制对象的CSS路径。

要查看我的意思,请在Firefox中访问google.com并使用Firebug检查徽标。右键单击'hplogo'div并选择'Copy CSS path'。你会得到类似的东西:

html body#gsr div#main span#body.ctr-p center div#lga div div#hplogo

这是一个非常有用的功能,我在Chrome上找不到,看来你只能复制Xpath。

有没有办法在Chrome中使用此类功能?

谢谢


7252
2017-07-12 00:19


起源

“非常有用”......怎么样? - wdm
只需注意 - 查看应用商店中应用的评论。几张海报提到了能够复制XPath和CSSPath的问题。我是Mac用户,只是安装了应用程序,很高兴看到路径,很难过无法复制路径。你的旅费可能会改变。
这就是为什么我还没有切换到Chrome的原因 - Chris
这确实是铬的一个很大的减号。 @wdm它是非常有用的,当你必须改变你没有构建的大型网站并且你很少有时间在firefox中你只需复制选择器并进行更改,你不必浪费时间试图理解所有的东西在网站上。 - Claudiu Creanga
@Claudiu听起来更像是支持坏习惯,特别是如果你正在使用像LESS或Sass这样的css预处理器。下一个出现的人将不得不理解你在原始版本上攻击的css规则。 - wdm


答案:


在Chrome中没有本机方式来获取此信息。你可以使用jQuery和书签做一堆黑客,如下所示: http://www.edmondscommerce.co.uk/chrome/tip-copy-css-selector-in-chrome/ 以及这里: http://www.selectorgadget.com/

但是,您可能会发现此扩展程序更接近您想要的,并且更容易使用: https://chrome.google.com/webstore/detail/lbghbpofdlcecfbpjgmffnkieenjkboi 它将拉取XPath以及CSS路径,并允许您轻松复制文本。


4
2017-07-12 01:03





在chrome中,您可以右键单击元素资源管理器视图中的元素,然后选择复制CSS路径或复制Xpath。


6
2018-03-11 10:55