chrome.declarativeContent

用法

声明式内容 API 允许您根据网页的 URL 和它的内容匹配的 CSS 选择器来显示您的扩展程序的页面按钮，而不需要拥有主机权限或插入内容脚本。为了在用户单击您的页面按钮后能够与网页交互，请使用 activeTab 权限。

如果您需要更精确地控制什么时候显示您的页面按钮，或者需要在用户单击它之前更改它的外观以匹配当前标签页，您还是需要继续使用页面按钮 API。

规则

作为一种声明式 API，该 API 让您在 onPageChanged 事件对象上注册规则，当一系列由 PageStateMatcher 表示的条件满足时执行某个操作（目前只有 ShowPageAction）。

当且仅当列出的所有条件都满足时，PageStateMatcher 才会匹配网页。当 https://www.google.com/ 上的页面存在密码字段时，以下规则将为该页面显示页面按钮：

      var rule1 = {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: { hostEquals: 'www.google.com', schemes: ['https'] },
            css: ["input[type='password']"]
          })
        ],
        actions: [ new chrome.declarativeContent.ShowPageAction() ]
      };
      

注意：所有条件和操作都通过构造函数创建，如以上例子所示。

如果要为包含视频的网站显示页面按钮，您可以添加第二个条件，每一个条件都足以触发所有指定的操作：

      var rule2 = {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: { hostEquals: 'www.google.com', schemes: ['https'] },
            css: ["input[type='password']"]
          }),
          new chrome.declarativeContent.PageStateMatcher({
            css: ["video"]
          })
        ],
        actions: [ new chrome.declarativeContent.ShowPageAction() ]
      };
      

添加的规则在浏览器重新启动后也将保留，所以请按照下面的方式注册它们：

      chrome.runtime.onInstalled.addListener(function(details) {
        chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
          chrome.declarativeContent.onPageChanged.addRules([rule2]);
        });
      });
      

注意：您一定要批量注册或取消注册规则，而不是一个一个地进行，因为每一次这样的操作都会重新创建内部的数据结构，这一重新创建的过程需要大量的计算，但是利用了一种更快的匹配算法。

将以上规则与 activeTab 权限一起使用，就能创建一个不需要任何安装时警告的扩展程序，使用户在相关的页面上单击它的页面按钮，并当用户单击页面按钮时在这些页面上运行。

CSS 匹配

PageStateMatcher.css 条件必须为复合选择器，这意味着您在选择器中不能包含组合器，例如空格或“>”。这有利于让 Chrome 浏览器更高效地匹配选择器。

CSS 条件只匹配显示的元素：如果匹配您的选择器的元素或者它的某个父元素为 display:none，这样不会使条件匹配。具有 visibility:hidden 样式、位置在屏幕以外或者被其他元素隐藏的元素仍然可以使您的条件匹配。

摘要

示例扩展程序

• Page action by content – Shows a page action for HTML pages containing a video
• Page action by URL – Shows a page action for urls which have the letter 'g' in them.