jQuery 处理网页内容的实现代码
作者:bea
jQuery提供两种实现这种功能的方法 – text()和html()。text()是对纯文本的处理;html()和text()相似,不同的是它还支持HTML代码。 代码如下: //设置ID为"b5_a"段落的内容为"这是新加入的文本信息"; $('#b5_a").text("这是新加入的文本信息"); //在ID为"b5_b"的div里加入一段html代码; $("#b5_b").html("<p>新加入一个html段落</p>");
jQuery提供两种实现这种功能的方法 – text()和html()。text()是对纯文本的处理;html()和text()相似,不同的是它还支持HTML代码。
代码如下:
//设置ID为"b5_a"段落的内容为"这是新加入的文本信息";
$('#b5_a").text("这是新加入的文本信息");
//在ID为"b5_b"的div里加入一段html代码;
$("#b5_b").html("<p>新加入一个html段落</p>");
有时我们要读取页面的内容,这也可以用text()和html()来实现。同样,使用text()得到的是纯文本;使用html()得到的是html代码。
代码如下:
//点击第二个按钮查看相关元素的文本内容
$("button:eq(1)").click(function(){
alert($('#b5_a').text());
});
//点击第四个按钮查看相关元素的HTML内容
$("button:eq(3)").click(function(){
alert($('#b5_a').html());
});
注意:text()和html()返回值得类型都是字符串型(string)。如果我们要对返回值进行算术运算,我们可以使用原始的JavaScript 函数:parseInt 或者 parseFloat 先把字符串转换成整形或者浮点型。
代码如下:
<ul id="u2">
<li>12.3</li>
<li>1.5</li>
</ul>
//通过下面的jQuery代码,可以对上述列表求和
$("button:eq(4)").click(function(){
var sum = 0;
$('li').each(function(index){
sum += parseFloat($(this).text());
});
alert(sum);
});
有用 | 无用
代码如下:
//设置ID为"b5_a"段落的内容为"这是新加入的文本信息";
$('#b5_a").text("这是新加入的文本信息");
//在ID为"b5_b"的div里加入一段html代码;
$("#b5_b").html("<p>新加入一个html段落</p>");
有时我们要读取页面的内容,这也可以用text()和html()来实现。同样,使用text()得到的是纯文本;使用html()得到的是html代码。
代码如下:
//点击第二个按钮查看相关元素的文本内容
$("button:eq(1)").click(function(){
alert($('#b5_a').text());
});
//点击第四个按钮查看相关元素的HTML内容
$("button:eq(3)").click(function(){
alert($('#b5_a').html());
});
注意:text()和html()返回值得类型都是字符串型(string)。如果我们要对返回值进行算术运算,我们可以使用原始的JavaScript 函数:parseInt 或者 parseFloat 先把字符串转换成整形或者浮点型。
代码如下:
<ul id="u2">
<li>12.3</li>
<li>1.5</li>
</ul>
//通过下面的jQuery代码,可以对上述列表求和
$("button:eq(4)").click(function(){
var sum = 0;
$('li').each(function(index){
sum += parseFloat($(this).text());
});
alert(sum);
});
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- JavaScript CSS修改学习第一章 查找位置
- JavaScript DOM 学习第九章 选取范围的介绍
- JavaScript DOM学习第八章 表单错误提示
- JavaScript DOM 学习第七章 表单的扩展
- JavaScript DOM 学习第五章 表单简介
- JavaScript DOM学习第四章 getElementByTagNames
- JavaScript DOM 学习第三章 内容表格
- JavaScript DOM 学习第二章 编辑文本
- javascript中的链式调用
- js删除select中重复项的实现代码
- JavaScript 题型问答有答案参考
- JavaScript 学习技巧
- JavaScript Timer实现代码
- 两个比较有用的Javascript工具函数代码
- 类似GMAIL的Ajax信息反馈显示
- JavaScript 10件让人费解的事情
- JQuery 动画卷页 返回顶部 动画特效(兼容Chrome)
- jQuery 处理表单元素的代码
- jQuery 树形结构的选择器