jquery - 是否可以使用 jQuery 来操作 XUL 元素？

Question

我知道可以将 jQuery 集成到 Firefox 插件中，但是我们能够操纵(动画、移动、调整透明度等)XUL 元素本身吗？

据我了解，Firefox 插件可以使用 jQuery 来操作 HTML/DOM 元素，但不确定 XUL 元素。

Answer 1

简短回答:是的

长答案:

我自己也尝试过。我只能以有限的方式使用它。可以对 XUL 元素进行操作。但我很难观察事件，因为我对 jQuery 还很陌生 - 我不知道如何调整它以观察 Firefox/XUL 级别的事件 - 我什至不知道是否需要调整:D

示例:

overlay.xul

<?xml version="1.0"?>    
<?xml-stylesheet href="chrome://testaddon/content/overlay.css" type="text/css"?>

<overlay id="testaddon_overlay"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        xmlns:html="http://www.w3.org/1999/xhtml">

    <script type="application/x-javascript" src="chrome://testaddon/content/jquery-1.4.2.js" />
    <script type="application/x-javascript" src="chrome://testaddon/content/overlay.js" />

    <toolbox id="navigator-toolbox">
        <toolbar toolbarname="TestAddonToolbar" class="chromeclass-toolbar">
            <toolbaritem>
                <toolbarbutton id="btnHide" label="HideMe" onclick="hideMe();" />
            </toolbaritem>            
        </toolbar>
    </toolbox>

</overlay>

overlay.js

function hideMe()
{
    $('#btnHide').hide();
}

上面的代码将在您单击按钮时隐藏该按钮 - 使用 jQuery 进行基本 XUL 操作!

但正如我所说，尝试观察文档加载和其他此类事件，它很快就会变得复杂(或者我知道的不多:D)。

更新:我尝试了一些效果。 Effects.fadeIn() 有效 - 但由于与 HTML 相比，XUL 中的透明度属性设置不同，按钮会停留在那里，最后突然消失。现在我们可以(不能)使用 jQuery 来操作 XUL 的程度已经变得很清楚了。