HTML DOM previousSibling用法及代码示例

previousSibling属性用于将指定节点的上一个节点作为Node对象返回；如果指定的节点是列表中的第一个节点，则返回null。这是一个只读属性。句法：

node.previousSibling

返回值：此属性返回指定节点的先前同级；如果当前节点没有先前同级，则返回null。
例：

<html> 
    <head> 
       <title>DOM previousSibling Property</title> 
    </head> 
    <body style = "text-align:center"> 
        <h1 style = "color:green"> 
            GeeksforGeeks 
        </h1> 
          
        <h2> 
            DOM previousSibling Property 
        </h2> 
          
        <div> 
            <span id="p1">GeeksforGeeks! </span><span id="p2"> 
               A computer science portal for geeks. 
            </span> 
        </div> 
        <br> 
          
        <button onclick="geek()">Click me!</button> 
        <br><br> 
        <p id="p" style = "margin:auto; width:40%"></p> 
  
        <!-- Function to return the previous node.-->
  
        <script> 
        function geek() { 
          var x =  
              document.getElementById("p2").previousSibling.innerHTML;  
          document.getElementById("p").innerHTML = x; 
          document.getElementById("p").style.color = "white"; 
          document.getElementById("p").style.background = "green"; 
        } 
        </script> 
    </body> 
</html>

输出：
在单击按钮之前：
previousSibling
单击按钮后：

注意：不要在两个兄弟元素之间放置空格，否则结果将是“undefined”。

支持的浏览器：下面列出了previousSibling属性支持的浏览器：

谷歌浏览器
IE浏览器
火狐浏览器
Opera
苹果浏览器

相关用法

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