查找并删除 DOM 元素保存在 jQuery 插件实例的闭包中

Question

简而言之，我有一个 jQuery 插件，它包含一个闭包数组，每个闭包都包含一个数组，该数组包含对插件当前负责的 DOM 元素的引用。截至目前，我正在尝试找到一种方法来从这些闭包中定位和删除对指定元素或元素组的引用。从数组中删除它们并不完全困难，因为 jQuery 和 JavaScript 都提供了实现此目的的方法。但是，我很难在数组本身中定位元素。这是我拥有的：

function _generate_closures (default_color, inst) {
  var color  = default_color;
  return {
    update : function (style) {
      color = style || default_color;
    },
    apply : function (style) {
      style = style || color;
      for (var i = 0; i < group.length; i++)
        group[i].css('color', style);
    },
    add : function ($elem) {
      group.push($elem);
    },
    remove : function ($elem)  {
      // Search for and delete elements from 'group' array
    },
    unbind_events : function (selector) {
      // unbind using namespaced events
    }
  };
}

我知道我可以使用返回的函数来进行搜索，但这是我似乎无法破解的实际搜索。我也可能从完全错误的角度来处理这个问题，我觉得这种情况更有可能发生。

我已经尝试将当前元素与闭包中的每个元素进行比较，使用 jQuery 的 $.inArray(element, group) 仍然一无所获。我什至使用了 group.indexOf(element)，但仍然无法以编程方式确定某个元素是否与用户指定的元素相同。

Answer 1

JQuery 提供了一个 .is 函数 (https://api.jquery.com/is/) 来测试一个元素是否相同。

function _generate_closures (default_color, inst) {
  var group = [];
  var color = default_color;
  return {
    update : function (style) {
      color = (style) ? style : default_color;
    },
    apply : function (style) {
      style = (style) ? style : color;
      for (var i = 0; i < group.length; i++) {
        group[i].css('color', style);
      }
    },
    add : function ($elem) {
      group.push($elem);
      alert('Group length is ' + group.length);
    },
    remove : function ($elem)  {
      for (var i = 0; i < group.length; i++) {
        if (group[i].is($elem)) {
         group.splice(i,1);
        }
        alert('Group length is ' + group.length);
      }
    },
    unbind_events : function (selector) {
      // unbind using namespaced events
    }
  };
}

var obj = _generate_closures('orange');
var $el= $('li:nth-child(2)');
obj.add($el);
obj.apply();
obj.remove($el);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>line 1</li>
  <li>line 2</li>
  <li>line 3</li>
  <li>line 4</li>
</ul>

查找并删除 DOM 元素保存在 jQuery 插件实例的闭包中

Finding and removing a DOM Element kept within a closure on a jQuery plugin instance

javascript

jquery-plugins

destroy