jquery中过滤器的应用,实现QQ的TAB效果

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#allfriends>li:not(:first)>div[name=body]").css("display", "none");
            $("#allfriends>li>div[name=title]").click(function () {
                $(this).siblings().slideToggle(100);
            });
        })
    </script>
</head>
<body>
    <ul id="allfriends">
        <li>
            <div name="title">
                我的好友</div>
            <div name="body">
                <ul>
                    <li>好友1</li><li>好友2</li><li>好友3</li></ul>
            </div>
        </li>
        <li>
            <div name="title">
                执着</div>
            <div name="body">
                <ul>
                    <li>执着1</li><li>执着2</li><li>执着3</li></ul>
            </div>
        </li>
        <li>
            <div name="title">
                黑名单</div>
            <div name="body">
                <ul>
                    <li>也是1?</li><li>2?</li><li>3??</li></ul>
            </div>
        </li>
    </ul>
</body>
</html>


ps:以上代码参考自杨中科老师的上课内容。实现工具为visual studio

原文地址:https://www.cnblogs.com/La5DotNet/p/2460642.html