使用jQuery循环遍历HTML的DOM

Question

我想用jQuery循环遍历html页面的DOM结构中的所有元素.基本上只需要body标签中的元素.

我想这样做的原因是因为我想获取body结构中每个元素的位置.

我搜索了一下,我发现我的问题没有答案.

非常感谢您的帮助.

Answer 1

$('body *').each(function() {
    // do stuff
});

如果您有内联<script>标签等,则可以添加:not选择器以排除这些标签:

$('body *:not(script, style, noscript)').each(function() {
    // do stuff
});

正如评论和jQuery 所有选择器文档中所指出的,这可能不会很好.我没有做任何实证测试,但这可能表现更好:

$('body').find('*').not('script, style, noscript').each(...);

Answer 2

可能性能最佳的解决方案是使用getElementsByTagName而不是jQuery选择器:

$(document.body.getElementsByTagName("*")).each(function () {
     // Do something here
});

*如jQuery文档本身所指出的,将选择器与任何东西组合通常不是一个好主意:

注意:全部或通用选择器非常慢,除非单独使用.

如果您真的想要,可以使用这些变体中的任何一种,但它们都不会给您提供如下良好的性能getElementsByTagName:

$(document.body).find("*");
$("body").find("*");
$("*", document.body);