在JavaScript中訪問FancyTree節點數據

Question

我第一次使用FancyTree，我想定義一些自定義節點數據，特別是用於創建樹的HTML數據中的一個名為“ content”的屬性：

    <li id="xxxx" data-content="true"  class="folder">

我有一個用JavaScript編寫的init事件處理程序，我想在那里訪問我的自定義數據屬性：

init: function(event, data, flag)
   {
    var tree = $("#tree").fancytree("getTree");
    node = tree.getNodeByKey(key);
    var data = node.data;

在一個在線教程中，我看到我的自定義屬性可以通過node.data.content來訪問，但是我無法在警報框中顯示我的自定義屬性以證明它是實際定義的。 如何在JavaScript函數中訪問自定義數據屬性？

謝爾頓

Answer 1

好的，所以我終於開始工作了。 您即將獲得結果。

鍵變量是一個字符串，代表您樹中每個LI元素的'id'屬性。 您將獲得具有該密鑰的節點。 獲取節點后，您可以檢索與該節點關聯的自定義數據屬性。 由於我們的“數據”變量是一個包含鍵/值的對象，因此您需要在數據對象上調用它的“鍵”名稱來檢索值，例如“ data.content”。

JS

$(function () {
    // using default options
    //Caching DOM element
    var $myTree = $("#tree").fancytree();
    // Get the DynaTree object instance
    var tree = $myTree.fancytree("getTree");
    //Set my key
    var key = "id1";
    //Get the node
    var node = tree.getNodeByKey(key);
    //Get the custom data attribute associated to that node
    var data = node.data;
    //data is an object so, data.content will give you the value of the attribute
    alert(data.content);
});

JSFIDDLE

希望這可以幫助！