JS/JQuery获取当前元素的上一个/下一个兄弟级元素等元素的方法

本文介绍: jQue ry.parent(exp r)，找父亲节点，可以传入exp r进行过滤，比如$(“span“).parent()或者$(“span“).parent(“.class“)jQue ry.find()，的返回结果，不会有初始集合中的内容，比如$(“p“).find(“span“)，是从

元素开始找，等同于$(“p span“)jQue ry.child ren(exp r)，返回所有子节点，这个方法只会返回直接的孩子节点，不会返回所有的子孙节点。//得到s的上一个兄弟节点。

$(function(){
    //遍历获取的input元素对象数组，绑定click事件
    var len = $("input[type='file']").length;
    for(var i = 0; i &lt; len; i++){
        $("input[type='file']").eq(i).click(function(){
            $(this).next().val("");
            $(this).next().hide();
            $(this).css("width","200px");
        })
    }
}

jQue ry 获取：

jQue ry.parent(e x pr)，找父亲节点，可以传入expr进行过滤，比如$(“span“).parent()或者$(“span”).pa rent(“.class“)

jQue ry.pa rents(expr)，类似于jQue ry.pa rents(expr),但是是查找所有祖先元素，不限于父元素

jQuery.child ren(expr)，返回所有子节点，这个方法只会返回直接的孩子节点，不会返回所有的子孙节点

jQuery.contents()，返回下面的所有内容，包括节点和文本。这个方法和child ren()的区别就在于，包括空白文本，也会被作为一个jQuery对象返回，children()则只会返回节点

jQuery.pre v()，返回上一个兄弟节点，不是所有的兄弟节点

var chils= s.childNodes;  //得到s的全部子节点
var par=s.parentNode;   //得到s的父节点
var ns=s.nextSibling;   //获得s的下一个兄弟节点
var ps=s.previousSibling;  //得到s的上一个兄弟节点
var fc=s.firstChild;   //获得s的第一个子节点
var lc=s.lastChild;   //获得s的最后一个子节点

<div id="test"&gt;
　　<div&gt;</div&gt;
　　<div&gt;</div>
</div>

var a = docuemnt.getElementById("test").getElementsByTagName("div");

var b =document.getElementById("test").childNodes;

if(childNode.nodeName=="#text") continue;//或者使用nodeType == 1

function del_ff(elem){
　　var elem_child = elem.childNodes;
　　for(var i=0; i<elem_child.length;i++){
　　　　if(elem_child[i].nodeName == "#text" &amp;&amp; !/s/.test(elem_child.nodeValue)){
　　　　　　elem.removeChild(elem_child[i])；
　　　　}
　　}
}

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
</head>
<body>
<div id="main">
    <span class="prev"></span>
    <div id="test">
    　　<div class="1"></div>
    　　<div class="2"></div>
    </div>
    <div class="3"></div>
</div>
<script>
function dom(){
　　var s= document.getElementById("test"),
       m= document.getElementById("main");
　　del_ff(s);  //清理空格
   del_ff(m);
　　var chils= s.childNodes; //得到s的全部子节点
　　var par=s.parentNode;  //得到s的父节点
　　var ns=s.nextSibling;  //获得s的下一个兄弟节点
　　var ps=s.previousSibling; //得到s的上一个兄弟节点
　　var fc=s.firstChild;  //获得s的第一个子节点
　　var lc=s.lastChild;  //获得s的最后一个子节点
}
function del_ff(elem){
　　var elem_child = elem.childNodes;
　　for(var i=0; i<elem_child.length;i++){
　　　　if(elem_child[i].nodeName == "#text" &amp;&amp; !/s/.test(elem_child.nodeValue)){
　　　　　　elem.removeChild(elem_child[i]);
　　　　}
　　}
}
window.onload = function(){
    dom();
}
</script>
</body>
</html