21節點之點擊按鈕設置div中p標簽改變背景顏色


<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            div {
          width: 300px;
          height: 450px;
          border: 1px solid red;
        }
      </style>
    </head>
    <body>
        <input type="button" value="變色" id="btn" />
        <div id="dv">
            <span>這是span</span>
            <p>這是p</p>
            <span>這是span</span>
            <p>這是p</p>
            <span>這是span</span>
            <p>這是p</p>
            <span>這是span</span>
            <a href="http://www.baidu.com">百度</a>
        </div>
        <script src="common.js"></script>
        <script type="text/javascript">
            //點擊按鈕 設置p標簽變色===節點的方式做
            my$("btn").onclick = function() {
                //先獲取div
                var dvObj = my$("dv");
                //獲取dv里面的所有節點
                var nodes = dvObj.childNodes;
                for (var i = 0; i < nodes.length; i++) {
                    //判斷這個節點是不是p標簽
                    if (nodes[i].nodeType == 1 && nodes[i].nodeName == "P") {
                        nodes[i].style.backgroundColor="red";
                    }
                }
            };
        </script>
    </body>
</html>

效果:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM