3

在我的 Firefox 扩展中,我有一个简单的树,它有两列。我正在尝试以编程方式:

  • 添加一行
  • 删除所有行

我的 XUL 树:

<tree flex="1" id="mytree" hidecolumnpicker="true">

  <treecols>
    <treecol id="sender" label="Sender" flex="1"/>
    <treecol id="subject" label="Subject" flex="2"/>
  </treecols>

  <treechildren>

  </treechildren>

</tree>

Javascript 我尝试添加行:

// trying to add rows
var data = {
    {'sender' : 'John', 'subject' : 'something'},
    {'sender' : 'Adam', 'subject' : 'something else'},
    {'sender' : 'Bob', 'subject' : 'something else again'}
};

document.getElementById("mytree").view.data = data;

这没有错误,树只是没有添加行。我知道代码运行,因为如果我添加alert()它会触发。

Javascript 我试图删除所有行:

var tree = document.getElementById("mytree");

tree.view.data = {};
tree.view.treeBox.rowCountChanged(0, -1);

这会产生一个错误:

document.getElementById("mytree").view.treeBox 未定义

编辑:

在 Wladimir 建议直接添加 XUL 元素之后,这将添加一行:

var treeChildren = document.getElementById("my_tree_children");

var treeitem = document.createElement('treeitem');
var treerow = document.createElement('treerow');

var treecell_1 = document.createElement('treecell');
var treecell_2 = document.createElement('treecell');

treecell_1.setAttribute('label', 'John');
treecell_2.setAttribute('label', 'something');

treerow.appendChild(treecell_1);
treerow.appendChild(treecell_2);

treeitem.appendChild(treerow);

treeChildren.appendChild(treeitem);

尽管在此示例中进行了硬编码,但单元格(标签属性)的值将来自用户输入。将用户输入直接放入 XUL 元素的属性时,我应该使用什么编码/转义方法来防止 XSS?

4

1 回答 1

0

让我这样问:为什么它应该起作用?文档告诉我们这tree.view是一个nsITreeView实例。并且nsITreeView没有名为 的属性data。仅仅因为你可以设置这个属性并不意味着它会做任何事情。

现在您将如何实际将数据放入tree小部件中?文档解释说有几种树类型,根据类型,数据可能来自不同的地方。您可能想要使用默认选项 - 内容树。这意味着您需要为treeitem数据中的每一行创建元素并将这些元素添加到treechildren元素中——如示例中所示。您可以使用常用的 DOM 方法动态生成这些元素。

tree部件还可以从 RDF 或 XML 数据源自动生成其内容。但是,如果您将数据保存在 JavaScript 对象中,则唯一的选择是创建自定义nsITreeView实现并将其分配给tree.view. 但这并不是微不足道的,而且通常是矫枉过正。

于 2012-05-24T09:15:09.560 回答