jQuery HTML 操作 改变/添加文本值

1、JQuery 改变p中的文本值

< html >
< head >
< script type="text/javascript" src="jquery-1.7.1.min.js"></ script >
< script type="text/javascript">
$(document).ready(function(){
   $("button").click(function(){
   $("p").html("Update text");
   });
});
</ script >
</ head >
 
< body >
< h2 >This is a heading</ h2 >
< p >This is a paragraph.</ p >
< p >This is another paragraph.</ p >
< button type="button">Click here</ button >
</ body >
 
</ html >

 2、JQuery 添加p中的文本值

< html >
< head >
< script type="text/javascript" src="jquery-1.7.1.min.js"></ script >
< script type="text/javascript">
$(document).ready(function(){
   $("button").click(function(){
   $("p").append(" Append text");
   });
});
</ script >
</ head >
 
< body >
< h2 >This is a heading</ h2 >
< p >This is a paragraph.</ p >
< p >This is another paragraph.</ p >
< button type="button">请点击这里</ button >
</ body >
 
</ html >

 3、after() 函数在所有匹配的元素之后插入 HTML 内容

< html >
< head >
< script type="text/javascript" src="jquery-1.7.1.min.js"></ script >
 
< script type="text/javascript">
$(document).ready(function(){
   $("button").click(function(){
   $("p").after(" Add  content.");
   });
});
</ script >
</ head >
 
< body >
< h2 >This is a heading</ h2 >
< p >This is a paragraph.</ p >
< p >This is another paragraph.</ p >
< button type="button">Click here</ button >
</ body >
 
</ html >

 4、jQuery HTML 操作

函数 描述
$(selector).html(content) 改变被选元素的(内部)HTML
$(selector).append(content) 向被选元素的(内部)HTML 追加内容
$(selector).prepend(content) 向被选元素的(内部)HTML “预置”(Prepend)内容
$(selector).after(content) 在被选元素之后添加 HTML
$(selector).before(content) 在被选元素之前添加 HTML
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值