jQuery移动节点

最新推荐文章于 2022-07-29 14:57:24 发布

原创最新推荐文章于 2022-07-29 14:57:24 发布 · 803 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#insertafter #移动节点

jQuery 专栏收录该内容

25 篇文章

订阅专栏

本文通过一个具体的HTML页面示例，展示了如何使用jQuery的insertAfter方法来改变DOM元素的位置。该示例中，一个带有ID为app1的<li>元素被移动到了另一个<li>元素之后。

insertafter移动节点

例子：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
    <script src="../scripts/jquery-1.3.1.js"></script>
    <script>
        $(function () {
            //使用insertafter把所有匹配的元素插入到另一个、指定的元素元素集合的后面。
            var ul_li3 = $("#app1");
            var b3 = $("#app");
            ul_li3.insertafter(b3);

        });
    </script>
</head>
<body>
    <p title="选择你喜欢的水果">选择你喜欢的水果是？</p>
    <ul>
        <li title="苹果" id="app">苹果1</li>
        <li title="香蕉" id="app1">香蕉1</li>
        <li title="橘子">橘子1</li>
        <li title="梨">梨1</li>
    </ul>
</body>
</html>