3

如何使用 javascript 加载 XUL 资源？我试图在 mdn 上搜索，但找不到任何示例。

这里的动机是我想在没有 id 属性的元素上创建一个覆盖。

例如，我有以下 xul 文件：

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<button label="Test button" oncommand="alert('Hello World!');"/>

</window>

我想使用 javascript 加载这个 xul 文件，抓住按钮并将其附加到另一个元素。

帮助将不胜感激。

4

3 回答 3

2

您应该使用常规的 DOM API。

您仍然可以在可以叠加的地方叠加元素，.appendChild()然后在适当的地方叠加。

或者完全使用 DOM API 创建它，这可能是更好更快的方法：

// XUL namespace is implied in XUL overlay scripts.
var btn = document.createElement("button");
btn.setAttribute("label", "Test Button");
btn.addEventListener("command", function() { alert("Hello World!"); }, false);
someElement.appendChild(btn);
于 2013-08-13T19:25:02.907 回答
1

如果你想加载一个本地 javascript 文件，那么有一个专门的帮助器：

//Check this for how the url should look like :
//https://developer.mozilla.org/en/mozIJSSubScriptLoader
function loadScript( url)
{
  var loader = Components.classes["@mozilla.org/moz/jssubscript-loader;1"].getService(Components.interfaces.mozIJSSubScriptLoader); 
  //The magic happens here
  loader.loadSubScript( url ); 
}

如果您想在 XUL 应用程序中加载本地 HTML 文件，那么由于安全风险，我认为这是不可能的（不再）。

于 2013-08-13T21:08:09.447 回答
1

我不是 100% 确定我是否完全理解你的问题，但我会尽力给我 2 美分。

我的方法不能帮助您从与您正在使用的文件不同的 xul 文件中获取元素，即使这可能，我也不知道。

当我想多次使用一个大元素时，我通常会做什么，比如当我想创建richlistboxitems时，我做的是：

我为这些项目创建了一个模板：

<richlistbox id="richlistbox"/>
<richlistitem id="richListItemTemplate" hidden="true">
   <listcell class="classOne" label="one" width="50"/>
   <listcell class="classTwo" label="two" width="80"/>
</richlistitem>

请注意，我隐藏了模板。

然后当我加载包含richlistbox的面板或页面时，我会动态填写它们：

for(var i = 0; i < elements.length; i++) {
   var item = document.getElementById("richListItemTemplate").cloneNode(true);
   item.removeAttribute("id");
   item.removeAttribute("hidden");
   item.getElementsByClassName("classOne")[0].setAttribute("label",elements.value);
   item.getElementsByClassName("classTwo")[0].setAttribute("label",elements.value);

   document.getElementById("richlistbox").appendChild(item);
}

这样，您将克隆原始元素，删除 id，但您可以通过该元素内唯一的 className 访问它的子元素。

也许你可以对你的按钮做同样的事情。您创建一个buttonTemplatewith id="myButtonTemplate"and hidden="true"，当您想将它附加到一个元素时，您执行一个 buttonTemplate.cloneNode(true) （因为您想要所有子元素），您按照您想要的方式对其进行自定义，然后将其附加到你想要的元素。

希望这对您有所帮助。

于 2013-08-30T00:40:06.367 回答