当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


HTML DOM previousElementSibling用法及代码示例


HTML DOM中的previousElementSibling属性用于返回与给定元素相同级别的先前元素。如果在同一级别上没有找到先前的元素,则它返回null。这是一个只读属性。它与previousSibling属性相似,但不同之处在于previousSibling属性将前一个兄弟节点作为元素节点,文本节点或注释节点返回,而previousElementSibling属性将前一个兄弟节点作为元素节点返回。

用法:

node.previousElementSibling

返回值:此属性返回指定元素的先前同级;如果当前元素没有先前同级,则返回null。


例:

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            HTML DOM previousElementSibling Property 
        </title> 
    </head> 
      
    <body> 
          
        <h2> 
            DOM previousElementSibling Property 
        </h2> 
          
        <h4 id = "h42">Web Languages:</h4> 
          
        <select size = "4"> 
            <option>HTML</option> 
            <option>CSS</option> 
            <option>JavaScript</option> 
            <option id = "Select">XML</option> 
        </select> 
        <br><br> 
          
        <button onclick = "Geeks()"> 
            Previous Element Sibling 
        </button> 
  
        <br><br> 
          
        <p id = "p"></p> 
          
        <script> 
        function Geeks() { 
            var a =  
            document.getElementById("Select").previousElementSibling; 
              
            document.getElementById("p").innerHTML = a.text; 
        } 
        </script> 
    </body> 
</html>                    

输出:
在单击按钮之前:
previousElementSibling
单击按钮后:
previousElementSibling

注意:不要在两个同级元素之间使用空格,否则,结果将为“undefined”。

支持的浏览器:下面列出了DOM previousElementSibling属性支持的浏览器:

  • 谷歌浏览器2.0
  • Internet Explorer 9.0
  • Firefox 3.5
  • Opera 10.0
  • Safari 4.0


相关用法


注:本文由纯净天空筛选整理自Vishal Chaudhary 2大神的英文原创作品 HTML | DOM previousElementSibling Property。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。