chrome content scripts 开发

manifest.json

{
    "manifest_version": 2,
    "name": "My extension",
    "version": "1.0",
    "content_scripts": [
        {
            "matches": ["http://www.baidu.com"],
            "js": ["jquery-3.1.1.min.js", "tesseract.js", "worker.js", "main.js"],
            "run_at": "document_end"
        }
    ]
}

manifest_version: 固定设置为2
name: 插件名称
version: 插件版本
content_scripts: 脚本
matches: 定义哪些页面需要注入content script
js: 需要向页面中注入的javascript文件,按定义顺序注入
run_at: 控制content script注入的时机。可以是document_startdocument_end或者document_idle。缺省时是document_idle

  • document_start: 文件将在所有CSS加载完毕,但是没有创建DOM并且没有运行任何脚本的时候注入
  • document_end: 文件将在创建完DOM之后,但还没有加载类似于图片或frame等的子资源前立刻注入。
  • document_idle: 浏览器会在document_end和发出window.onload事件之间的某个时机注入。具体的时机取决与文档加载的复杂度,为加快页面加载而优化

安装插件

在chrome浏览器地址栏输入 chrome://extensions/ 打开扩展程序,选中 开发者模式 ,点击 加载已解压的扩展程序… 按钮加载扩展程序所在目录

网页完全加载之后执行脚本

run_at取值document_end,文件将在创建完DOM之后,但还没有加载类似于图片或frame等的子资源前立刻注入。如果需要在页面完全加载(图片或frame等子资源也加载)之后执行脚本,可以通过检查document.readyState属性来实现,例如

function waitForComplete() {
    if (document.readyState != "complete") {
        setTimeout(function() { waitForComplete(); }, 50);
    } else {
        // do something
    }
}

waitForComplete();
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值