jQuery 移动节点

最新推荐文章于 2025-06-03 09:11:34 发布

原创最新推荐文章于 2025-06-03 09:11:34 发布 · 758 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了一种利用jQuery操作DOM的方法，通过实例演示了如何将指定的列表项（如西瓜）移动到另一个列表项（如橘子）的前面或后面，这是一种常见的网页交互效果实现方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script src="Scripts/jquery-1.11.3.js"></script>
    <script type="text/javascript">
        $(function () {
            var $li_1 = $("li:eq(1)");
            var $li_2 = $("li:eq(2)");
            //将元素1插入到元素2的前面（把西瓜放到橘子的前面）
            $($li_2).insertBefore($li_1);
            //将元素1插入到元素2的后面（把西瓜放到橘子的前面）
            //$($li_1).insertAfter($li_2);
        });
    </script>
</head>
<body>
    <p title="请选择喜欢的水果">水果列表 </p>
    <ul>
        <li title="苹果">苹果</li>
        <li title="橘子">橘子</li>
        <li title="西瓜121">西瓜</li>
    </ul>
</body>