页面多jstree实例下，如何程序化展开指定Banana节点

首先得指出你代码里的一个关键小问题：jQuery的引用顺序错了——jstree依赖jQuery才能正常工作，所以必须把jQuery的脚本放在jstree资源之前，否则树根本没法初始化成功。这是第一步要修正的。

接下来，要单独操作Banana对应的jstree实例，核心就是精准定位到那个树容器，再调用jstree的API来展开节点，完全不需要改动现有树结构。

下面是调整后的完整代码，我会标注关键细节：

<!-- 先加载jQuery，这是jstree的基础依赖 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- 再加载jstree的样式和脚本 -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>

<div id="multiple_jstree_wrapper">
  <div class="jstree-node" data-name="apple">
    <ul>
      <li>Apple
        <ul>
          <li>Child node 1</li>
          <li>Child node 2</li>
        </ul>
      </li>
    </ul>
  </div>
  <div class="jstree-node" data-name="banana">
    <ul>
      <li>Banana
        <ul>
          <li>Child node 1</li>
          <li>Child node 2</li>
        </ul>
      </li>
    </ul>
  </div>
  <div class="jstree-node" data-name="orange">
    <ul>
      <li>Orange
        <ul>
          <li>Child node 1</li>
          <li>Child node 2</li>
        </ul>
      </li>
    </ul>
  </div>
</div>

<script>
$(function () {
  // 初始化所有jstree实例，这部分和你原来的逻辑一致
  $('.jstree-node').jstree();

  // 精准定位到Banana对应的树容器，避免影响其他实例
  const bananaTree = $('.jstree-node[data-name="banana"]');
  
  // 调用jstree的open_node方法展开指定节点
  // 这里用文本内容定位节点，如果给节点加了唯一id，用id会更可靠
  bananaTree.jstree('open_node', 'li:contains("Banana")');
});
</script>

几个重要细节说明： #

1. 引用顺序：必须先加载jQuery，再加载jstree的资源，否则jstree无法绑定到jQuery对象上，初始化会直接失败。
2. 实例隔离：通过data-name="banana"这个自定义属性，我们只操作目标树，完全不会影响Apple和Orange树的原有状态。
3. 节点选择优化：如果你的Banana节点有唯一标识（比如给<li>加个id="banana-root"），可以把open_node的参数改成#banana-root，这样即使文本内容后期有变化，也不会影响操作，稳定性更高。

如果你的树是异步加载的（比如从后端动态获取节点），建议在jstree的ready事件里执行展开操作，确保树完全初始化完成后再进行操作：

$('.jstree-node[data-name="banana"]').on('ready.jstree', function() {
  $(this).jstree('open_node', 'li:contains("Banana")');
});

这样就能完美实现你想要的效果：程序化展开Banana节点，同时保留所有树的原有结构和状态。

内容的提问来源于stack exchange，提问作者EaBengaluru