Jq dom 操作

最新推荐文章于 2022-03-28 13:13:53 发布

X W F

最新推荐文章于 2022-03-28 13:13:53 发布

阅读量104

点赞数 1

分类专栏： jQuery

本文链接：https://blog.csdn.net/weixin_46399258/article/details/108193309

版权

jQuery 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>操作节点</title>
  </head>
  <body>
    <p title="选择你最喜欢的体育活动">你最喜欢的体育运动是？</p>
    <ul>
      <li title="踢足球">踢足球</li>
      <li title="打篮球">打篮球</li>
      <li title="乒乓球">乒乓球</li>
    </ul>
    <script src="../jquery.js"></script>
    <script>
      $(function () {
        $("ul").append("<li>123</li>"); // 向元素的内部的末尾插入节点
        $("ul").prepend("<li>123</li>"); // 向元素的内部的开头插入节点
        $("li:eq(2)").before("<li>颉旺飞</li>"); // 前面插入节点
        $("li:eq(3)").after("<li>王佳慧</li>"); // 后面插入节点
        $("<li>无敌</li>").insertBefore("li:eq(0)").css("color", "red"); // 指定的子节点之前插入一个节点
        $("<li>无敌</li>").insertAfter("li:eq(7)").css("color", "red"); // 指定的子节点之后插入一个节点
      });
    </script>
  </body>
</html>

X W F

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Jq dom 操作

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>操作节点</title> </head> <body> <p t
复制链接

扫一扫