动态解除绑定XBL的方法

Question

我在一个没有重新启动的附加文件中应用了这样的绑定：

var css = '.findbar-container { -moz-binding:url("' + self.path.chrome + 'findbar.xml#matchword") }';
var cssEnc = encodeURIComponent(css);
var newURIParam = {
    aURL: 'data:text/css,' + cssEnc,
    aOriginCharset: null,
    aBaseURI: null
}
cssUri = Services.io.newURI(newURIParam.aURL, newURIParam.aOriginCharset, newURIParam.aBaseURI);
myServices.sss.loadAndRegisterSheet(cssUri, myServices.sss.USER_SHEET);

findbar.xml内容如下：

<?xml version="1.0"?>
<bindings xmlns="http://www.mozilla.org/xbl" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
    <binding id="matchword">
        <content>
            <children/>
            <xul:toolbarbutton anonid="matchwordbtn" accesskey="w" class="tabbable" label="Whole Word Only" tooltiptext="Match only whole words" oncommand="console.log('hi')" type="checkbox"/>
        </content>
    </binding>
</bindings>

这只是在FindBar上添加了一个按钮，标签为“整个单词”。但是现在要删除它，我只是用myServices.sss.unregisterSheet(cssUri, myServices.sss.USER_SHEET);注销样式表，但是这并不是解除绑定。

一个在ask.mozilla.org上回答告诉我，这是预期的行为，但没有提供任何解决方案。

我在想，也许我应该动态添加绑定，而不是通过CSS，我没有测试这个，但它不符合XBL更新的三个原因：

1. 绑定元素匹配指定不同绑定的样式规则。
2. 元素将从绑定文档中移除。
3. 元素被销毁(例如，通过关闭文档)

答案告诉我，这是一种令人期待的古怪行为。

Answer 1

嗯，我刚刚记得，我有一些工作代码，可以(重新)绑定不同的XBL绑定。

事情是这样的：

• 有一个基本绑定，或者没有(在您的例子中，是.findbar-container的原始绑定)。
• 然后我有多个类来定义不同的-moz-bindings。
• 这些类在运行时被设置和删除。

既然这对我有用，理论上应该适用于你：

• 在您的样式中，不对元素本身有规则，但是对于类有规则，例如.findbar-coner.myaddonclass{ moz-binding：.}
• 在您的代码中，在加载时添加那个新的类。 document.querySelectorAll(".findbar-container")，e => e.classList.add("myaddonclass" )；
• 在您的代码中，在卸载时再次删除类： document.querySelectorAll(".findbar-container")，e => e.classList.remove("myaddonclass" )；

这将强制CSS规则重新计算，并且绑定重新计算，从而适合“绑定元素匹配指定不同绑定的样式规则”规则。

当然，当您想要重新绑定的所有元素在加载您的外接程序时都已经存在时，这很糟糕，但是MutationObserver可以帮助您重新绑定.