如何解决Chrome 或 Firefox 中的 Web 开发人员模式:如何获取对象的 CSS 完整选择器?
当我打开 Web Developer 工具并检查页面时,有时我希望选择一个元素并复制(即获取整个文本)其 CSS 选择器。
我的意思是:
由于某种原因,该框中的文本不可选择,右键单击不显示菜单或选项。
有没有办法抓取或导出该文本,以便我可以在我的代码中处理它?
解决方法
右键单击检查器中的元素,选择复制子菜单,每个浏览器提供的选项略有不同:
-
Chrome(以及其他基于 Chromium 的浏览器,包括新的 Microsoft Edge)为您提供了复制选择器的选项,这会生成一个经过优化但仍然相当长的选择器,用于唯一标识元素。
-
Firefox 为您提供了两个选项:“CSS 选择器”的功能与 Chrome 大致相同,但为您提供了更优化的选择器,以及“CSS 路径”,它为您提供与您所指向的相同的选择器您的屏幕截图,从根开始到该元素的整个路径。 “CSS Path”是为网络测试工具设计的,但对于大多数其他用例来说可能过多了,我猜这就是 Chrome 没有类似功能的原因。
查看这些其他答案,我在其中详细解释了这些功能的工作原理:
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。