【Jquery-02】jq中的排他思想与链式编程

jQuery中的排他思想

当前元素设置样式,其余兄弟元素清除样式

$(this).css("color","red");
$(this).siblings().css("color","空格");
<script>
<script>
        $(function() {
            // 1. 鼠标经过左侧的小li 
            $("#left li").mouseover(function() {
                // 2. 得到当前小li 的索引号
                var index = $(this).index();
                console.log(index);
                // 3. 让我们右侧的盒子相应索引号的图片显示出来就好了
                // $("#content div").eq(index).show();
                // 4. 让其余的图片(就是其他的兄弟)隐藏起来
                // $("#content div").eq(index).siblings().hide();
                // 链式编程
                $("#content div").eq(index).show().siblings().hide();

            })
        })
    </script>
</script>

==注意:==eq()选择器超级好用!可以联动下标

1.6.链式编程

$(this).css("color","red").siblings().css("color","")


版权声明:本文为liqiannan8023原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。