【实践】js封装 jq siblings 方法
思路:
1、获取调用元素的父元素下的所有子元素(即它的所有同辈元素和调用元素本身)
2、遍历调用元素父元素下的所有子元素 除调用元素外的所有元素保存在一个数组里面
代码如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js 封装siblings 方法</title> </head> <body> <div id="div1"> <p>第一个p标签</p> <p>第二个p标签</p> <p>第三个p标签</p> <p>第四个p标签</p> <p>第五个p标签</p> </div> <script type="text/javascript"> var div1 = document.querySelector("#div1"); var someChild = div1.querySelectorAll("p"); var siblings = siblingsOf(someChild[3]); console.log(siblings); function siblingsOf(elem){ var len = 0; var children = elem.parentNode.childNodes;//获取目标元素的所有兄弟元素和它自身 var siblings = new Array(); for (var i = 0 , len = children.length; i < len; i++) { //判断此元素是一个元素节点而且不是调用元素的本身 //若为真放进数组里面 if (children[i].nodeType == 1 && children[i] != elem) { siblings.push(children[i]); } } //返回最后得出的结果数组 return siblings; } </script> </body> </html>