如何递归搜索 DIV 中的所有 SPAN 元素？答案

【问题标题】：How to search for all SPAN elements inside the DIV recursively?如何递归搜索 DIV 中的所有 SPAN 元素？
【发布时间】：2022-01-19 13:04:36
【问题描述】：

我正在尝试查找 DIV 内的所有 SPAN 元素，并且该函数返回找到的 SPAN 的数组。

下面我做了一个递归函数，但是它带来了43个SPAN，我期望7个SPAN：

function findRecursive(myElement, elementName, element) {
    if (element == null){
        element = {'element':null, 'array':[]}
    }

    if (element['element']) {
        myElement = element['element']
    }

    if (element['array'] === undefined) {
        element['array'] = []
    }

    var arr = element['array']
    var els = myElement.getElementsByTagName(elementName)

    for (let i = 0; i < els.length; i++) {
        const e = els[i];
        if (e.tagName == elementName) {
            arr.push(e)
        }
        args = {'element':e, 'array': arr}
        findRecursive(null, elementName, args)
    }
    return arr
}

var e = document.getElementById('main')
var result = findRecursive(e, 'SPAN')
console.log(result)

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="main">
        <span>
            <span>
                <span>
                    <span>
                        <span>
                            mySpan1
                        </span>
                    </span>
                </span>
                <span>
                    <span>
                        mySpan2
                    </span>
                </span>
            </span>
        </span>
    </div>
</body>
</html>

这段代码有什么问题？我应该带 7 个 SPAN

【问题讨论】：

标签： javascript html recursion

【解决方案1】：

我认为您可能已经过火了... ;-)

document.querySelectorAll('div[id="main"] span');

详细了解querySelector 和querySelectorAll

【讨论】：

或者，更短的 jQuery 替代方案：$('#main span)
@AndrewCorrigan 为什么假设他包含了 jquery？
我不是，从代码中我可以看到他根本没有 - 但是寻找 jQuery 解决方案的被误导的人可能会被引导到这里。我只是倾向于包括这两个选项，除非他们特别要求一种或另一种方式。
好的，谢谢。我要问另一个与 iframe 相关的问题
@megaultron 那么您必须获取 iframe 内容，然后在内部内容上使用 querySelector。见这里：stackoverflow.com/questions/1088544/…