一、我们先创建一第空白的网页，创建一个p元素，然后链接jQuery库文件。
图1
二、我们在脚本区域创建button元素。
图2
三、我们用append的方法，在p标签里加入刚才我们创建的按钮。
图3
图4
四、接下来我们把p标签删掉，做两个盒子box1和box2，box2在box1里面。
图5
五、我们把按钮追加到box1里面。
图6
图7
六、我们把按钮加入到box1里面，box2前面。
图8
图9
七、把按钮插入到box1前面。
图10
图11
八、在box1之后插入按钮。
图12
图13
九、总结，里面追加用append()，里面之前用prepend()，后面插入用after()，前面插入用before()。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="//img.17u1u.com/https://code.jquery.com/jquery-3.3.1.min.js"></script> </head> <body> <p></p> <script> var $ebt = $("<button>我就是创建的按钮</button>"); $("p").append($ebt); </script> </body> </html> //以下是第二部分的代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="//img.17u1u.com/https://code.jquery.com/jquery-3.3.1.min.js"></script> <style> .box1{ background: red; width: 200px; height: 60px; } .box2{ background: green; width: 100px; height: 30px; } </style> </head> <body> <div class="box1"> <div class="box2"></div> </div> <script> var $ebt = $("<button>我就是创建的按钮</button>"); // 上面就是创建的button元素 $(".box1").after($ebt); // box1之后插入$ebt </script> </body> </html>
