js在操作dom的场景中，有时候会有相似的场景需要。
js用前缀名查找class节点
// 参数dom为html dom节点// 参数key为需含糊查问的名称字段function queryClassNode(dom, key) { let collectArray = []; for (var i = 0; i < dom.childNodes.length; i++) { // 外围点 if (dom.childNodes[i].attributes && dom.childNodes[i].attributes["class"] && dom.childNodes[i].className.indexOf(key) !== -1) { collectArray.push(dom.childNodes[i]); } if (dom.childNodes[i].childNodes.length > 0) { let res = queryClassNode(dom.childNodes[i], key); for (var k = 0; k < res.length; k++) { collectArray.push(res[k]); } } } return collectArray;}js用前缀名查找Id节点
// 参数dom为html dom节点// 参数key为需查问的前缀名function queryIdNode(dom, key) { let collectArray = []; for (var i = 0; i < dom.childNodes.length; i++) { // 外围点 if (dom.childNodes[i].attributes && dom.childNodes[i].attributes["id"] && dom.childNodes[i].id.indexOf(key) !== -1) { collectArray.push(dom.childNodes[i]); } if (dom.childNodes[i].childNodes.length > 0) { let res = queryIdNode(dom.childNodes[i], key); for (var k = 0; k < res.length; k++) { collectArray.push(res[k]); } } } return collectArray;}成果
<html><body><div> <div></div> <div> <span id="test1"> 233 <span class="demo1">666</span> </span> <span id="test2"> <span id="test3">666</span> <span class="demo1">888</span> <span class="demo2">999</span> </span> </div></div></body><script>.........console.log(queryIdNode(document.body, 'test')); // [span#test1, span#test2, span#test3]console.log(queryClassNode(document.body, 'demo')); // [span.demo1, span.demo1, span.demo2]</script></html>