如何将图标置于jsTree树的顶部

Question

我有一个 jsTree树，希望在树的最顶部放置一个“孤星”类型的图标，就像这样...

在树的最顶部：

jsTree是一款jQuery插件，提供交互式树形结构。它完全免费，开源，并在MIT许可下分发。jsTree易于扩展，主题化和配置，支持HTML和JSON数据源以及AJAX加载。jsTree在内容框或边框框模型中正常运行，可以作为AMD模块加载，并具有内置的响应式设计移动主题，可轻松自定义。它使用jQuery的事件系统，因此绑定树中各种事件的回调很熟悉和容易。

- rajeev

Answer 1

只需要在容器上方添加一个div，就像这样：

只需在容器上方添加一个div，就像这样：

<div>
  <img src="star.png">
</div>
<div id="container" role="main" style="height: 430px;">
  <div id="tree" class="jstree jstree-1 jstree-default jstree-default-small" role="tree" aria-multiselectable="true" tabindex="0" aria-activedescendant="/" aria-busy="false" style="height: 430px;">
    <ul class="jstree-container-ul jstree-children jstree-striped" role="group">
      <li role="treeitem" aria-selected="false" aria-level="1" aria-labelledby="/_anchor" aria-disabled="true" aria-expanded="true" id="/" class="jstree-node  jstree-open jstree-last"><i class="jstree-icon jstree-ocl" role="presentation"></i><a class="jstree-anchor  jstree-disabled" href="#" tabindex="-1" id="/_anchor"><i class="jstree-icon jstree-themeicon folder jstree-themeicon-custom" role="presentation"></i>root</a>
        <ul role="group"
        class="jstree-children">
          <li role="treeitem" aria-selected="false" aria-level="2" aria-labelledby="MENU1_anchor" aria-expanded="false" id="MENU1" class="jstree-node  jstree-closed"><i class="jstree-icon jstree-ocl" role="presentation"></i><a class="jstree-anchor" href="#" tabindex="-1" id="MENU1_anchor"><i class="jstree-icon jstree-themeicon folder jstree-themeicon-custom" role="presentation"></i>MENU1</a>
          </li>
          <li role="treeitem" aria-selected="false" aria-level="2" aria-labelledby="MENU2_anchor" aria-expanded="false" id="MENU2" class="jstree-node  jstree-closed jstree-last"><i class="jstree-icon jstree-ocl" role="presentation"></i><a class="jstree-anchor" href="#" tabindex="-1" id="MENU2_anchor"><i class="jstree-icon jstree-themeicon folder jstree-themeicon-custom" role="presentation"></i>MENU2</a>
          </li>
        </ul>
      </li>
    </ul>
  </div>
  <div id="data" style="height: 430px;">
    <div class="content code" style="display: none; height: 430px;">
      <textarea id="code" readonly="readonly"></textarea>
    </div>
    <div class="content folder" style="display: none; height: 430px;"></div>
    <div class="content image" style="display: none; position: relative; height: 430px;">
      <img src="" alt="" style="display:block; position:absolute; left:50%; top:50%; padding:0; max-height:90%; max-width:90%;">
    </div>
    <div class="content default" style="text-align: center; height: 430px; line-height: 430px;">Select a file from the tree.</div>
  </div>
</div>

我没有一个star.png文件，但它看起来像这样：

- nycynik