一、我们先创建一第空白的网页,创建一个p元素,然后链接jQuery库文件。
![c4c7a615487d135db172e3f0fc7c9086.png](https://i-blog.csdnimg.cn/blog_migrate/9095c1df6c3252d73ca045895d2d3267.jpeg)
图1
二、我们在脚本区域创建button元素。
![191cc9903af7550e8e7585fc6dbcb2df.png](https://i-blog.csdnimg.cn/blog_migrate/fd6b989b37af5d716668bda84a7514db.jpeg)
图2
三、我们用append的方法,在p标签里加入刚才我们创建的按钮。
![06da8c1b2a62502f4660e29a53cab61e.png](https://i-blog.csdnimg.cn/blog_migrate/3cdb1b1364d597d38a6192a81ad8842b.jpeg)
图3
![948ec1529e8106e590772366680fa0d8.png](https://i-blog.csdnimg.cn/blog_migrate/ccc657227238a3ec883d746f6ae3cea7.jpeg)
图4
四、接下来我们把p标签删掉,做两个盒子box1和box2,box2在box1里面。
![abc63e809656dc4d46af7ae8d31f62e8.png](https://i-blog.csdnimg.cn/blog_migrate/9934ec104ccd52fabc6dc9e75ab14cf5.jpeg)
图5
五、我们把按钮追加到box1里面。
![314d21e8d750fafc0aa5707c2a86e449.png](https://i-blog.csdnimg.cn/blog_migrate/95fae5f695ced62f2f4bbedee474d0a4.jpeg)
图6
![8d9d0686970ded5f2b6f6bc8fc79ba3d.png](https://i-blog.csdnimg.cn/blog_migrate/42727c3d18b5924cffba2b63c7849093.jpeg)
图7
六、我们把按钮加入到box1里面,box2前面。
![a458249f06f9ecb8a0fab064493994c4.png](https://i-blog.csdnimg.cn/blog_migrate/a10d0fd0cbd92ec7fe0a9c82490e02f8.jpeg)
图8
![8bd91e7078a6fda7887f208880e80427.png](https://i-blog.csdnimg.cn/blog_migrate/5182f40a9117ff62dd005f88c939c90b.jpeg)
图9
七、把按钮插入到box1前面。
![4d5a51a7e59b54ff973add9bbe8d3138.png](https://i-blog.csdnimg.cn/blog_migrate/c51f6e1b3fc632fad350c3b4688f66c6.jpeg)
图10
![25237283a1ca5eea7292fb74071171ea.png](https://i-blog.csdnimg.cn/blog_migrate/02a76f6f2fec2731362eb6289416cb2f.jpeg)
图11
八、在box1之后插入按钮。
![ac0b57dfd125fe663a15caa3d0d29e77.png](https://i-blog.csdnimg.cn/blog_migrate/8031da3890af9ad9afbbe0d80307b875.jpeg)
图12
![7b5a4ed1042dfa2ed2aaeda389ee8a61.png](https://i-blog.csdnimg.cn/blog_migrate/689da6aed145dfb6a8a7dc1ac4c0e86b.jpeg)
图13
九、总结,里面追加用append(),里面之前用prepend(),后面插入用after(),前面插入用before()。
DocumentDocument