Bootstrap Treeview添加target属性：节点折叠展开后属性丢失如何解决？

这个问题我之前做项目时也碰到过——bootstrap-treeview在展开或折叠节点时，会重新渲染对应的DOM元素，这就导致你一开始只执行一次的addTarget函数，没法覆盖新生成的链接元素，所以target属性会丢失。

核心解决思路：利用插件的rendered事件钩子 #

bootstrap-treeview自带了rendered事件，这个事件会在初始渲染完成和每次节点展开/折叠后重渲染完成时触发。我们只需要在这个事件触发时重新调用addTarget函数，就能确保所有a标签（包括新生成的）都被处理。

具体实现步骤 #

1. 优化你的addTarget函数（可选，让代码更简洁）
   可以用jQuery的filter方法直接筛选出href非#的链接，同时注意标准的新窗口属性是_blank（_new是非标准写法，部分浏览器兼容但不推荐）：

   function addTarget() {
     $('.treeview').find('a')
       .filter(function() {
         return $(this).attr('href') !== '#';
       })
       .attr('target', '_blank');
   }
   

2. 在Treeview初始化时绑定rendered事件
   假设你的Treeview初始化代码是这样的，在初始化后通过.on()绑定事件：

   // 替换成你的Treeview容器ID和数据
   $('#myTree').treeview({
     data: treeData,
     // 你的其他配置项，比如color、expandIcon等
   }).on('rendered', function() {
     // 每次渲染完成后自动执行addTarget
     addTarget();
   });
   

为什么这个方法有效？ #

每次你展开或折叠节点，Treeview都会重新生成对应的DOM节点，这时候rendered事件会被触发，我们的addTarget函数就会再次遍历所有a标签，给符合条件的链接加上target="_blank"属性，完美解决重渲染后属性丢失的问题。

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