码迷,mamicode.com
首页 > Web开发 > 详细

jquey学习2之jquery动态添加页面片段

时间:2014-07-18 22:11:16      阅读:329      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   java   color   strong   

第一个方法:append()方法

    【1】$(selector).append(content)//向匹配的所有标签中的内容末尾处添加Html代码,会编译成页面显示。 

bubuko.com,布布扣
 1 <html>
 2 <head>
 3 <script type="text/javascript" src="/jquery/jquery.js"></script>
 4 <script type="text/javascript">
 5 $(document).ready(function(){
 6   $("button").click(function(){
 7     $("p").append(" <b>Hello world!</b>");
 8   });
 9 });
10 </script>
11 </head>
12 <body>
13 <p>This is a paragraph.</p>
14 <p>This is another paragraph.</p>
15 <button>在每个 p 元素的结尾添加内容</button>
16 </body>
17 </html>
View Code

    【2】$(selector).append(function(index,html))//利用函数,向匹配的所有标签中的内容末尾处添加html代码。会编译成页面显示。

bubuko.com,布布扣
 1 <html>
 2 <head>
 3 <script type="text/javascript" src="/jquery/jquery.js"></script>
 4 <script type="text/javascript">
 5 $(document).ready(function(){
 6   $("button").click(function(){
 7     $("p").append(function(n){
 8       return "<b>This p element has index " + n + "</b>";
 9     });
10   });
11 });
12 </script>
13 </head>
14 
15 <body>
16 <h1>This is a heading</h1>
17 <p>This is a paragraph.</p>
18 <p>This is another paragraph.</p>
19 <button>在每个 p 元素的结尾添加内容</button>
20 </body>
21 </html>
View Code

fads

jquey学习2之jquery动态添加页面片段,布布扣,bubuko.com

jquey学习2之jquery动态添加页面片段

标签:style   blog   http   java   color   strong   

原文地址:http://www.cnblogs.com/shangxiaofei/p/3853500.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!