javascript - Chrome 扩展 - 用于在任何页面上运行 js 的简单内容脚本

标签 javascript google-chrome

如何编写一个简单的 Chrome 扩展内容脚本,在每次页面加载时执行 JavaScript(例如 alert("hello");)?

因此,当我导航到页面或重新加载页面时,JavaScript 应该运行。

这是迄今为止我的 manifest.json 文件:

{
    "name": "Highlight some phrases",
    "description": "Hightlight some pre defined text from websql database after page loads",
    "version": "0.1",
    "permissions": [
        "tabs","<all_urls>"
    ],
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    },

    "content_scripts": [
        {
        "matches": [
            "http://*/*",
            "https://*/*"
        ],
        "js": ["content.js"]
        }
    ],

    "background": {
        "page": "background.html" 
    },

    "manifest_version": 2
}

最佳答案

如果您只需要在每次页面加载或重新加载时提醒hello,下面是一个简单的演示: Manifest.json:

{
    "name": "Highlight some phrases",
    "description": "Hightlight some pre defined text after page loads",
    "version": "0.1",
    "permissions": [
        "tabs","<all_urls>"
    ],
    "browser_action": {
        "default_icon": "icon.png"
    },
    "content_scripts": [
        {
        "matches": [
            "http://*/*",
            "https://*/*"
            ],
        "js": ["content.js"],
        "run_at": "document_end"    // Pay attention to this line
        }
    ], 
    "manifest_version": 2
}

content.js:

// alert("hello");
document.body.style.background = 'yellow';

是的,够了。
当然,不要忘记在这两个文件所在的同一目录中添加一个名为 icon.png 的图标,然后在 Google Chrome 中进行测试。

关于javascript - Chrome 扩展 - 用于在任何页面上运行 js 的简单内容脚本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19347499/

相关文章:

javascript - 如何避免 Chrome 跟踪事件重叠

javascript - 从 AngularJS 服务检索值而不返回它们?

javascript - Ruby on Rails 与 HTML CSS 和 JavaScript

javascript - Karma 在 Chrome 中打开了 3 次。 karma 虫?

google-chrome - Chrome 检查器不显示网络请求路径等

javascript - Facebook 在 Chrome 中给出 "Unsafe JavaScript attempt to access frame with URL"错误

javascript - Google+ 从 Javascript 登录 - 原始参数值无效

javascript - AJAX 调用中的对象仅在客户端服务器上未定义

javascript - 有没有一种方法可以_derive_null 而不是显式分配它?

javascript - 移动浏览器是否支持使用 HTML5 视频标签的 4k 视频?