<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> p{background-color:red; } #div2{background-color:blue;} </style> <script src="js/jquery.js"></script> <script> $(function(){ $('#btnok').bind('click',function(){ //1.在元素尾部插入内容 //$('#div1').append('world'); //2.在元素头部插入内容 //$('#div1').prepend('I O V '); //3.把匹配到的内容插入到元素的尾部 //$('p').appendTo('#div2'); //4.把匹配到的内容插入到元素的头部 $('#div2').prependTo('#p1'); }); }); </script> </head> <body> <p id="p1">p1</p> <hr /> <div id="div1">hello~</div> <hr /> <div id="div2">div2</div> <hr /> <input type="button" id="btnok" value="插入操作" /> </body> </html>