chrome扩展程序:页面加载完javascript后运行脚本

用户名

页面加载完成后,这根本不会触发。基本上,当我单击浏览器操作按钮时,它将触发它,并且在页面加载时,它将运行脚本。在我的background.js中

var toggle = false;
chrome.browserAction.onClicked.addListener(function(tab) {
  toggle = !toggle;

  if(toggle){
    chrome.browserAction.setIcon({path: "icons/logo.png", tabId:tab.id});
//    chrome.tabs.executeScript(tab.id, {file:"SCRIPT.user.js"});
    chrome.tabs.executeScript(tab.id, {code:"alert('aaxxxbbaa')"});
  }
  else{
    chrome.browserAction.setIcon({path: "icons/icon48.png", tabId:tab.id});
    chrome.tabs.executeScript(tab.id, {code:"alert('bbdxdb')"});
  }
});

var filter = {'url': [
  {hostSuffix: '*', pathPrefix: ''},
  {hostSuffix: '*', pathPrefix: ''}
]};


chrome.webNavigation.onDOMContentLoaded.addListener(function(tab){
    if (toggle)
        chrome.tabs.executeScript(tab.id,{code:"alert('loaded')"});
},filter);

我也尝试将其设置在清单中

{
  "name": "Tool",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "Te",
  "homepage_url": "",
  "icons": {
    "16": "icons/logo.png",
    "48": "icons/logo.png",
    "128": "icons/logo.png"
  },
  "default_locale": "en",
  "background": {
    "page": "src/bg/background.html",
    "persistent": true
  },
  "browser_action": {
    "default_icon": "icons/logo.png",
    "default_title": "browser action demo"
  },
  "permissions": [
    "<all_urls>"
  ],
  "content_scripts": [
    {
      "run_at": "document_end",
      "matches": [
        "https://www.google.ca/*"
      ],
      "css": [
        "src/inject/inject.css"
      ]
    },
    {
      "run_at": "document_end",
      "matches": [
        "https://www.google.ca/*"
      ],
      "js": [
        "src/inject/inject.js"
      ]
    }
  ]
}

在我的inject.js中

chrome.extension.sendMessage({}, function(response) {
    var readyStateCheckInterval = setInterval(function() {
    if (document.readyState === "complete") {
        clearInterval(readyStateCheckInterval);
        // ----------------------------------------------------------
        // This part of the script triggers when page is done loading
        console.log("Hello. This message was sent from scripts/inject.js");
        // ----------------------------------------------------------

    }
    }, 10);
});

window.addEventListener ("load", myMain, false);

function myMain (evt) {
    console.log('aaann');
    var jsInitChecktimer = setInterval (checkForJS_Finish, 111);

    function checkForJS_Finish () {
        if (    typeof SOME_GLOBAL_VAR != "undefined"
            ||  document.querySelector ("SOME_INDICATOR_NODE_css_SELECTOR")
        ) {
            clearInterval (jsInitChecktimer);
            // DO YOUR STUFF HERE.

            console.log('hi');
        }
    }
}
基列夫

在清单文件中,您有重复的内容脚本,一个包含CSS,一个包含JS。它看起来应该像这样:

  "content_scripts": [
    {
      "run_at": "document_end",
      "matches": [
        "https://www.google.ca/*"
      ],
      "js": [
        "src/inject/inject.js"
      ],
      "css": [
        "src/inject/inject.css"
      ]
    }
   ]

另外,如果您希望它与其他网址匹配,则需要专门添加它们,或使用

"matches": ["<all_urls>"]

至于您建议的背景脚本,这实际上是在重新发明内容脚本的概念,并且可能不符合您的最大利益。我建议坚持使用内容脚本路由。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Chrome扩展程序-等待页面重新加载以继续执行脚本

来自分类Dev

设置cookie后运行脚本,无需重新加载页面

来自分类Dev

刷新页面后,Chrome扩展程序内容脚本才会加载

来自分类Dev

刷新页面后才加载Chrome扩展程序内容脚本

来自分类Dev

桌面加载后运行脚本

来自分类Dev

桌面加载后运行脚本

来自分类Dev

在ajax加载后重新运行脚本

来自分类Dev

在 gui 加载后运行脚本

来自分类Dev

Chrome扩展程序:如何在页面加载时运行Javascript(不打开弹出窗口)

来自分类Dev

如何从 chrome 扩展上下文在页面上运行脚本?

来自分类Dev

开发Chrome扩展程序时,如何打开空白页以运行脚本?

来自分类Dev

Chrome扩展程序未在文档开始时运行脚本并且未打印内容

来自分类Dev

页面完全加载后如何运行脚本,没有jquery,又没有在底部放置脚本?

来自分类Dev

在已加载到页面中的元素上运行脚本

来自分类Dev

在WordPress的所有帖子页面加载中运行脚本

来自分类Dev

如何在 ContextMenu 上运行脚本 单击 Chrome 扩展

来自分类Dev

Chrome扩展程序:如何使后台等待执行脚本?

来自分类Dev

chrome.runtime.sendMessage在重新加载Chrome扩展程序后从内容脚本抛出异常

来自分类Dev

Chrome扩展程序:创建一个新标签页,等待其完成加载,执行脚本

来自分类Dev

页面加载完javascript / jquery后执行代码

来自分类Dev

Chrome扩展程序-脚本加载事件?

来自分类Dev

Javascript:在新页面中打开链接并运行脚本

来自分类Dev

Chrome扩展程序加载后,HTML页面显示不正确

来自分类Dev

用户重新加载页面后如何执行代码?(Chrome 扩展程序)

来自分类Dev

Javascript:页面加载完成后运行功能,脚本正在异步加载

来自分类Dev

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

来自分类Dev

是否可以在查看源页面上的Chrome扩展程序中运行内容脚本?

来自分类Dev

安装后运行脚本

来自分类Dev

在Chrome中运行脚本

Related 相关文章

  1. 1

    Chrome扩展程序-等待页面重新加载以继续执行脚本

  2. 2

    设置cookie后运行脚本,无需重新加载页面

  3. 3

    刷新页面后,Chrome扩展程序内容脚本才会加载

  4. 4

    刷新页面后才加载Chrome扩展程序内容脚本

  5. 5

    桌面加载后运行脚本

  6. 6

    桌面加载后运行脚本

  7. 7

    在ajax加载后重新运行脚本

  8. 8

    在 gui 加载后运行脚本

  9. 9

    Chrome扩展程序:如何在页面加载时运行Javascript(不打开弹出窗口)

  10. 10

    如何从 chrome 扩展上下文在页面上运行脚本?

  11. 11

    开发Chrome扩展程序时,如何打开空白页以运行脚本?

  12. 12

    Chrome扩展程序未在文档开始时运行脚本并且未打印内容

  13. 13

    页面完全加载后如何运行脚本,没有jquery,又没有在底部放置脚本?

  14. 14

    在已加载到页面中的元素上运行脚本

  15. 15

    在WordPress的所有帖子页面加载中运行脚本

  16. 16

    如何在 ContextMenu 上运行脚本 单击 Chrome 扩展

  17. 17

    Chrome扩展程序:如何使后台等待执行脚本?

  18. 18

    chrome.runtime.sendMessage在重新加载Chrome扩展程序后从内容脚本抛出异常

  19. 19

    Chrome扩展程序:创建一个新标签页,等待其完成加载,执行脚本

  20. 20

    页面加载完javascript / jquery后执行代码

  21. 21

    Chrome扩展程序-脚本加载事件?

  22. 22

    Javascript:在新页面中打开链接并运行脚本

  23. 23

    Chrome扩展程序加载后,HTML页面显示不正确

  24. 24

    用户重新加载页面后如何执行代码?(Chrome 扩展程序)

  25. 25

    Javascript:页面加载完成后运行功能,脚本正在异步加载

  26. 26

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

  27. 27

    是否可以在查看源页面上的Chrome扩展程序中运行内容脚本?

  28. 28

    安装后运行脚本

  29. 29

    在Chrome中运行脚本

热门标签

归档