<jQuery> <方法> 十九. each()方法(遍历方法)

来源:
网络
收录时间:
2021-04-29 00:58:46
阅读 88

摘要: &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &lt;style&gt;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        ul>li {
            width: 100px;
            height: 100px;
            background-color: pink;
            display: block;
            margin-top: 10px;
        }
    </style>
</head>
<body>
<ul>
    <li>01</li>
    <li>02</li>
    <li>03</li>
    <li>04</li>
    <li>05</li>
    <li>06</li>
    <li>07</li>
    <li>08</li>
    <li>09</li>
    <li>10</li>
</ul>
<script src="jquery-3.2.1.js"></script>
<script>
    $(function () {
        // 遍历方法1
        // for (var index = 0; index < $("ul>li").length; index++) {
        //     $("ul>li").eq(index).css("opacity", (index+1)/10);
        // }

        // 遍历方法2
        $("ul>li").each(function (index, element) {
           $("ul>li").eq(index).css("opacity", (index+1)/10);
        });
    });
</script>
</body>
</html>
查看全文
相关笔记
相关分类
相关标签
返回顶部