挑战：
a) 绑定一个点击方法到这个div，点击后此元素会淡出消失
b) 同时克隆一个新的div元素到页面，元素内容是前面div文字内容反向书写(即，sgatbg olleh)，同样也具有上面的点击事件绑定，元素淡出消失
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8"/> <title>克隆一个页面元素及其相关元素</title> <style type="text/css"> .box { width: 150px; height: 100px; line-height: 100px; border: 1px solid #000; text-align: center; background: #00ff00; cursor: pointer; } </style> <script type="text/javascript" src="../js/jquery-1.11.0.js"></script> <script type="text/javascript"> $(function() { var $box = $(‘.box‘); $box.click(function() { var $this = $(this); var $boxClone = $this.clone(true); var str = $this.text(); var reverseContent = str.reverse(); $boxClone.text(reverseContent); $this.fadeOut(‘slow‘); $(‘body‘).append($boxClone); }); }); function reverse() { var str = ‘‘; var end = this.length - 1; for (;end >= 0; end--) { str = str + this.charAt(end); } return str; } String.prototype.reverse = reverse; </script> </head> <body> <div class="box"> hello, World! </div> </body> </html>
[jQuery编程挑战]003 克隆一个页面元素及其相关事件
原文：http://www.cnblogs.com/jerry19890622/p/4286985.html