jQuery遍历-祖先

来源：互联网发布：网络新词汇大全编辑：程序博客网时间：2024/06/05 18:05

这仅仅是自己的学习笔记，只为记录自己的成长。

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>jQuery遍历-祖先</title>    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>      <style>        .ancestors, .ancestors *        {         display: block;        border: 2px solid lightgrey;        color: lightgrey;        padding: 5px;        margin: 15px;        }    </style>    <script>        $(document).ready(function(){            //$("span").parent().css({"border": "2px solid red", "color": "red"})            //$("span").parents().css({"border": "2px solid red", "color": "red"})            //$("span").parents("ul").css({"border": "2px solid red", "color": "red"})            $("span").parentsUntil("div").css({"border": "2px solid red", "color": "red"})        })    </script></head><body>    body<div class="ancestors">ancestors    <div style="width:500px;">div (曾祖父)        <ul>ul (祖父)          <li>li (直接父)            <span>span</span>        </li>        </ul>       </div>    <div style="width:500px;">div (祖父)           <p>p (直接父)            <span>span</span>        </p>     </div>  </div></body></html>

阅读全文

0 0