preface

As a students of poor English, every time writing code, you need to define variables and how to take an elegant and have semantic naming, become a problem in my daily work, have to rely on kingsoft powerword, every time to help me to solve this problem, each time to copy documents to translation page and think it’s a waste of time, as a result, initiation of an idea in mind, Write your own Chrome so you can learn the process and meet your own needs.

Engineering structure

A plug-in doesn’t require much information, especially when our requirements are simple, such as the simple three files for our plug-in:

Define the plugin

Must attribute

Version: indicates the version number of your plug-in. Manifest_version specifies the manifest file format version. After Chrome18, it should always be 2, so you can set it to 2.

Recommended attributes

Description: Describes the ICONS of the plug-in. Plugin ICONS, 16(Extension info bar), 48 (Extension page), 128 (icon displayed in the “Applications” bar when adding a TAB) Browser_action: You can set the extension info bar icon, icon hover prompt, click on the icon to pop up window (my plugin does not need popup window, so not set) default_locale: Browser permissions: Describes the permissions needed in the plugin. Common permissions are as follows: 1. Tabs: Access the browser TAB. 4. Storage menus, 5

Background: if you need to run background scripts, such as listening for the user to press your plugin icon in the extension info bar, or if you want to listen for the user to create a new TAB page, you need to have a background page update_url: Update_url Specifies the automatic update address (for unofficial releases, automatic updates can be set)

Function implementation

Because the function is simple, we only need to write a JS script to complete the corresponding function

Chorme API provides three new right-click menus. The parent/parent relationship is built by id and parentId, and the click time completes the post-click callback processing

Installing a plug-in

  1. Open your browser, select Settings, and click Extensions.

2. Open developer mode so that our custom plugin can be loaded. 3. Click load the decompressed extension and select the directory where our files are saved. 4. After loading, remember to turn on the enable plug-in switch in custom plug-in.

Effect of the demo

A simple operation and you have everything you want.