繁体   English   中英

这是查询元素及其子元素的最佳方法吗?

Is this the best way to query an element and its children?

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我正在尝试查询元素及其子元素以查找以特定字符串开头的ID。

var foundIDs = containerElement.find('[id^=something]').andSelf().filter('id^=something');

find()方法仅搜索后代,所以我想尝试andSelf() 但是, andSelf()没有选择器。 这意味着无论容器元素是否与查找查询匹配,都将包括该容器元素,然后,如果容器元素毕竟不匹配,我必须对其执行辅助filter()来删除该容器元素。

我试图把andSelf() find() ,但它似乎没有容器元素拿起入堆栈。

containerElement.andSelf().find('[id^=something]');

有什么更好的方法可以实现我的目标吗?

4 个回复

刚刚离开我的头顶(未经测试):

var foundIDs = containerElement
                     .filter('id^=something')
                     .add(containerElement.find('id^=something'));

这并没有比您的初衷更加有效,但是我认为它稍微干净了一点。

containerElement.find('*').andSelf().filter('[id^=something]');

我知道您已经接受了答案,但是无论如何我都会把这个扔掉。

var foundIDs = containerElement.wrap('<div>')             // Wrap
                               .parent()                  // Traverse up
                               .find('[id^=something]');  // Perform find

containerElement.unwrap();  // DOM is untouched

因为您在功能完成之前就展开了containerElement包装,所以DOM保持不变(以防您想知道)。

我用livequery插件验证了它,它从未检测到新的div

如果您记录了foundID的ID(或其他值),您将看到顶层是您的containerElement(假设它符合.find()条件)。

console.log( foundIDs.attr('id') );  // Log the ID of the root element.

编辑:

关于测试,我对只有两个嵌套元素的containerElement在两个版本上执行了1,000次迭代循环。

我仅在Mac上的Safari中进行过测试。

可接受的答案快了大约7倍。

如果添加100个嵌套元素,则差距缩小到不到2倍。

这是麻烦。 如果containerElement不匹配,则两个版本均返回0个元素。 我不确定为什么会这样。

这个性能比我的其他答案更好,但是您失去了接受的答案所提供的链接能力。

    // Do a typical find.
var found = containerElement.find('[class^=something]');

    // Test the containerElement directly,
    //    and push it into the 'found' object if it matches.
if( containerElement.is('[class^=something]') ) found.push(containerElement);
3 在元素而非子元素上设置点击处理程序事件的反应方式

通过以下方式设置onClick事件时: 最后,我想从事件目标中获取field属性。 现在的问题是:当我单击按钮区域时,我将获得字段属性,但是当单击子级时,它也会触发事件,但会触发事件,但来自另一个目标元素(它没有字段属性; ...我可以设置课程)。 但是,有没有更好的方法可以使整 ...

2017-10-10 19:47:08 2 37   reactjs
4 从父元素中删除子元素的最佳方法? [重复]

这个问题在这里已有答案: 删除子节点(或元素)或设置innerHTML =“”? 3个答案 我正在使用dinamically创建的JavaScript元素。 所有元素都附加到同一个div中,但有时我需要清空div并添加新元素。 在之前的项目中,我使用了一种 ...

5 查询子代及其子代,直到没有子代简化为止

假设我们有一个具有以下属性的实体: 子代是任何具有非null ParentId的Foo。 父子关系可以有多个级别,目前最多为5个。 是否有一种简单的LINQ方式或通用方法以Foo开头并使其所有子代,子代子代以及子代子代,等等? 目前,我要遍历初生父母的每个孩子,然后再次遍历 ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM