
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8" /> <script src="js/jquery-1.8.3.js"></script> <style type="text/css"> #div1{ width:200px; height:200px; border:1px solid blue; } </style> <script type="text/javascript"> $(function () { $('#btn1').click(function () { var linkObj = $('<a href="http://www.luofenming.con">在DIV内容追加元素 </a>');//创建元素 $('#div1').append(linkObj); }) }); $(function () { $('#btn2').click(function () { var linkObj = $('<a href="http://www.luofenming.con">在DIV内容前添加元素 </a>');//创建元素 $('#div1').prepend(linkObj); }) }); $(function () { $('#btn3').click(function () { var linkObj = $('<a href="http://www.luofenming.con">在DIV外追加元素 </a>');//创建元素 $('#div1').after(linkObj); }) }); $(function () { $('#btn4').click(function () { var linkObj = $('<a href="http://www.luofenming.con">在DIV外前添加元素 </a>');//创建元素 $('#div1').before(linkObj); }) }); </script> </head> <body> <input type="button" id="btn1" value="在DIV内容追加元素" /><br /><br /> <input type="button" id="btn2" value="在DIV内容前添加元素" /><br /><br /> <input type="button" id="btn3" value="在DIV外追加元素" /><br /><br /> <input type="button" id="btn4" value="在DIV外前添加元素" /><br /><br /> <div id="div1"> 123456aaaaaa </div> </body> </html>