如何从扁平jQuery对象中获取指定ID的元素？（find方法无效时）

嘿，这问题我遇过！咱们先搞明白为啥.find()不管用，再给你几个靠谱的解决方案：

问题根源 #

你用这段代码创建元素时：

var asd = $('<div id="0"/><div id="1"/><div id="2"/>');

jQuery返回的是一个包含三个独立同级div的集合，而.find()方法的作用是查找当前元素的后代子元素——这些div互相之间是平级的，没有嵌套关系，所以.find('#1')自然找不到目标元素啦。

解决方案 #

方案1：用.filter()筛选集合内的元素

既然目标元素就在当前的jQuery集合里，直接用.filter()来筛选就行，这是最直接的办法：

var asd = $('<div id="0"/><div id="1"/><div id="2"/>');
// 从集合中筛选出id为1的元素
var targetDiv = asd.filter('#1');

// 现在可以随意修改或追加内容了
targetDiv.text('更新后的文本内容')
          .append('<span>这是追加的新元素</span>');

方案2：先给元素套个父容器，再用.find()

如果后续需要频繁查找子元素，建议先把这些div包裹在一个父容器里，这样.find()就能正常工作了：

// 把三个div放到一个父div内部
var asd = $('<div><div id="0"/><div id="1"/><div id="2"/></div>');
// 现在用.find()就能找到后代里的id=1的div
var targetDiv = asd.find('#1');

targetDiv.html('<p>修改后的HTML内容</p>');

方案3：通过索引直接获取

因为你创建的元素是按顺序排列的，id为1的div是集合里的第二个元素（索引从0开始），所以也可以用.eq(1)快速获取：

var asd = $('<div id="0"/><div id="1"/><div id="2"/>');
var targetDiv = asd.eq(1);

targetDiv.append('<div>新的子元素</div>');

额外提示 #

如果之后你把这些元素添加到页面DOM中了，直接用$('#1')就能全局获取到这个元素，不用再从集合里筛选啦~

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