11JQuery笔记———————-动态创建小广告的案例

 1 <html xmlns="http://www.w3.org/1999/xhtml">
 2 <head>
 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 4     <title></title>
 5     <script src="jquery-1.8.3.js"></script>
 6     <script type="text/javascript">
 7         $(function () {
 8             //向页面添加一个div的层，并设置div的属性
 9             $(\':button\').click(function () {
10                var dvObj= $(\'<div style="height:300px;width:300px;background-color:orange;position:absolute;right:0px;bottom:0px;"></div>\').appendTo($(\'body\'));
11                //单击x号的时候，关闭广告
12                $(\'<span style="float:right;cursor:pointer">x</span>\').click(function () {
13                    $(this).parent().remove();
14                }).appendTo(dvObj);
15             });
16         });
17     </script>
18 </head>
19 <body>
20     <input type="button" name="name" value="来一个小广告" />
21 </body>
22 </html>

 

版权声明：本文为clcloveHuahua原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/clcloveHuahua/p/5124871.html