<!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>