练习-jq的遍历

要求:
鼠标移动到任意li元素上时获取该元素的内容(即在控制台输出)
点击页面的时候将元素的内容依次加1000

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>111</li>
        <li>222</li>
        <li>333</li>
        <li>444</li>
        <li>555</li>
    </ul>
    <script src="jquery-1.10.1.min.js"></script>
    <script>
        // 鼠标移动到任意li元素上时获取该元素的内容(即在控制台输出)
        // 点击页面的时候将元素的内容依次加1000
        // $("li").eq(i)
        // console.log($("li").length);
        // JQ对象.index()
        $("li").mouseover(function (){
            console.log($(this).html());
        })
        $(document).click(function (){
            for(var i=0;i<$("li").length;i++){
                $("li").eq(i).html($("li").eq(i).html()-0+1000);   //在jq中eq相当于第i项
                // $("li").eq(i).html()获取的是字符串,所以要转换成数字
            }
        })

        // 下面的这种写法是错的,因为在jq中获取值的时候获取的是第一个元素的内容,其它元素得到的内容也是第一个,所以都变成了111,在111的基础上加1000
        // $(document).click(function(){
        //     $("li").html($("li").html()-0+1000);
        // })
    </script>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值