CSS Selector Capture Pro

Generate a copiable CSS Selector with a mouseover without Devtool

什么是CSS Selector Capture Pro？

CSS Selector Capture Pro是由POINT & SHOOT开发的Chrome扩展程序，该扩展的主要功能是“Generate a copiable CSS Selector with a mouseover without Devtool”。

扩展截图

screenshot
screenshot
screenshot

下载CSS Selector Capture Pro扩展crx文件

下载CSS Selector Capture Pro扩展crx格式的文件，手动将Chrome插件安装到浏览器中，也可以将crx文件分享给朋友，轻松安装Chrome插件。

扩展使用说明

                        Clean, simple and intuitive to use, accompanied with these exclusive features.
✓ Copiable and tweak-able Selector ready to use in CSS/JavaScript
✓ Highlights of elements which match the Selector
✓ Total matches based on the Selector within Viewport context
✓ The choice of Concise or Verbose selector
✓ Minimal interference with the page


≡ How to Use

* User Guide: https://github.com/CharltonC/chrome-css-selector-capture/blob/master/README.md

* Enable the App, Use "CTRL" Key to lock／unlock the selector highlight in position and click the Copy button to copy the selector.

* If needed, click on the selector path to tweak the selector before copying.

* Use "ESC" key to exit the App


≡ Where would this extension be useful

* The extension would typically suit the use of Front End Development, End to End testing such as Selenium as well as Data Scraping where visually identifying a target, matches and getting the CSS selector are needed.

* Lite version also available: https://chrome.google.com/webstore/detail/css-selector-capture-lite/cfjcaifmdcgnnbbnhgmgikdbonflhmaa


≡ Privacy

* The extension does NOT collect any data or send data to third party.


≡ Release

* 2.3.2 (2023.08.24)
  - Upgraded to manifest v3

* 2.3.1 (2021.09.01)
  - Fixed algorithm in v2.3.0

* 2.3.0 (2021.07.15)
  - Optimization for concise selector

* 2.2.0 (2019.03.23)
  - Added a User Guide Link in Extension Icon Popup

* 2.1.0 (2019.03.21)
  - Added a shortcut hotkey (CTRL) for locking toggle of the overlays

* 2.0.0 (2019.02.25)
  - Optimization for concise selector (i.e. shorter)
  - Adjustment of selector background opacity when trigger button for Settings Dialog is on top and user hovers it

* 1.0.3 (2018.10.15)
  - Optimization for selector retrieval

* 1.0.0 (2018.09.29)
  - Initial Release

扩展基本信息

名称 CSS Selector Capture Pro CSS Selector Capture Pro
ID cpnkcffhllafbdbljkmhebnpbnlhapmd
官方URL https://chromewebstore.google.com/detail/css-selector-capture-pro/cpnkcffhllafbdbljkmhebnpbnlhapmd
简介 Generate a copiable CSS Selector with a mouseover without Devtool
文件大小 115 KB
安装次数 11,260
当前版本 2.3.2
更新时间 2023-08-24
上架时间 2019-12-06
评分 5.00/5 共11次评分
开发者 POINT & SHOOT
电子邮箱 [email protected]
付费类型 free
扩展官网 https://github.com/CharltonC/chrome-css-selector-capture
帮助页面URL https://github.com/CharltonC/chrome-css-selector-capture/blob/master/README.md
支持的语言 en
manifest.json 
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "manifest_version": 3,
    "name": "CSS Selector Capture Pro",
    "version": "2.3.2",
    "minimum_chrome_version": "88",
    "description": "Generate a copiable CSS Selector with a mouseover without Devtool",
    "author": "Charlton Cheng",
    "offline_enabled": true,
    "permissions": [
        "storage",
        "clipboardWrite"
    ],
    "host_permissions": [
        ""
    ],
    "icons": {
        "16": "common\/icon_16.png",
        "32": "common\/icon_32.png",
        "48": "common\/icon_48.png",
        "128": "common\/icon_128.png"
    },
    "content_scripts": [
        {
            "all_frames": false,
            "run_at": "document_end",
            "matches": [
                "*:\/\/*\/*"
            ],
            "js": [
                "common\/app.min.js",
                "content-script\/main.min.js"
            ]
        }
    ],
    "action": {
        "default_icon": {
            "16": "common\/icon_16.png",
            "24": "common\/icon_24.png",
            "32": "common\/icon_32.png"
        },
        "default_title": "CSS Selector Capture Pro",
        "default_popup": "popup\/index.html"
    },
    "web_accessible_resources": [
        {
            "resources": [
                "common\/app.min.css",
                "common\/shl-app-icomoon.woff"
            ],
            "matches": [
                ""
            ]
        }
    ]
}

相关的扩展

SelectorsHub
SelectorsHub
Selector Finder
Selector Finder
Copy Css Selector
Copy Css Selector
Visual CSS Editor
Visual CSS Editor
Amino: Live CSS Editor
Amino: Live CSS Editor
SelectorGadget
SelectorGadget
Ranorex Selocity
Ranorex Selocity
CSS Selector Tester
CSS Selector Tester
CSS Selector Helper
CSS Selector Helper
CSS Selector Finder for Chrome Devtools
CSS Selector Finder for Chrome Devtools
Find Selector
Find Selector
Element Locator
Element Locator