jQuery 处理网页内容的实现代码


Posted in Javascript onFebruary 15, 2010

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); 
});
Javascript 相关文章推荐
深入理解JavaScript系列(2) 揭秘命名函数表达式
Jan 15 Javascript
Javascript实现多彩雪花从天降散落效果的方法
Feb 02 Javascript
JavaScript中this详解
Sep 01 Javascript
jQuery中on绑定事件后引发的事件冒泡问题如何解决
May 25 Javascript
深入理解JavaScript单体内置对象
Jun 06 Javascript
JS代码实现根据时间变换页面背景效果
Jun 16 Javascript
jQuery无刷新上传之uploadify3.1简单使用
Jun 18 Javascript
Bootstrap整体框架之JavaScript插件架构
Dec 15 Javascript
SpringMVC+bootstrap table实例详解
Jun 02 Javascript
用Node编写RESTful API接口的示例代码
Jul 04 Javascript
vue 实现把路由单独分离出来
Aug 13 Javascript
Vue实现省市区三级联动
Dec 27 Vue.js
JS getMonth()日期函数的值域是0-11
Feb 15 #Javascript
不同浏览器对回车提交表单的处理办法
Feb 13 #Javascript
Jquery iframe内部出滚动条
Feb 11 #Javascript
jquery 问答知识整理
Feb 11 #Javascript
改善你的jQuery的25个步骤 千倍级效率提升
Feb 11 #Javascript
jQuery 改变CSS样式基础代码
Feb 11 #Javascript
jQuery 添加/移除CSS类实现代码
Feb 11 #Javascript
You might like
深入理解PHP之require/include顺序 推荐
2011/01/02 PHP
探讨各种PHP字符串函数的总结分析
2013/06/05 PHP
php+mysqli预处理技术实现添加、修改及删除多条数据的方法
2015/01/30 PHP
PHP+mysql实现的三级联动菜单功能示例
2019/02/15 PHP
PHP7.0连接DB操作实例分析【基于mysqli】
2019/09/26 PHP
[原创]IE view-source 无法查看看源码 JavaScript看网页源码
2009/07/19 Javascript
利用JQuery的load函数动态加载其它页面的内容的实现代码
2010/12/14 Javascript
A标签触发onclick事件而不跳转的多种解决方法
2013/06/27 Javascript
浏览器窗口大小变化时使用resize事件对框架不起作用的解决方法
2014/05/11 Javascript
Egret引擎开发指南之视觉编程
2014/09/03 Javascript
jquery操作angularjs对象
2015/06/26 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
2020/11/18 Javascript
jQuery旋转木马式幻灯片轮播特效
2015/12/04 Javascript
JavaScript修改作用域外变量的方法
2016/03/25 Javascript
Javascript中字符串replace方法的第二个参数探究
2016/12/05 Javascript
jQuery EasyUI ProgressBar进度条组件
2017/02/28 Javascript
jQuery使用EasyUi实现三级联动下拉框效果
2017/03/08 Javascript
js 函数式编程学习笔记
2017/03/25 Javascript
js自定义Tab选项卡效果
2017/06/05 Javascript
vuejs 单文件组件.vue 文件的使用
2017/07/28 Javascript
Vue.js实现大转盘抽奖总结及实现思路
2019/10/09 Javascript
JS实现普通轮播图特效
2020/01/01 Javascript
[01:09:01]完美世界DOTA2联赛循环赛 Magma vs PXG BO2第一场 10.28
2020/10/28 DOTA
python僵尸进程产生的原因
2017/07/21 Python
解决pandas.DataFrame.fillna 填充Nan失败的问题
2018/11/06 Python
Keras:Unet网络实现多类语义分割方式
2020/06/11 Python
利用scikitlearn画ROC曲线实例
2020/07/02 Python
纯CSS3大转盘抽奖示例代码(响应式、可配置)
2017/01/13 HTML / CSS
Alexandre Birman美国官网:亚历山大·伯曼
2019/10/30 全球购物
新员工欢迎词
2014/01/12 职场文书
小学国庆节活动方案
2014/02/11 职场文书
2014幼儿园班主任工作总结
2014/12/04 职场文书
会计人员岗位职责
2015/02/03 职场文书
解决Nginx 配置 proxy_pass 后 返回404问题
2021/03/31 Servers
使用redis生成唯一编号及原理示例详解
2021/09/15 Redis
Java中生成微信小程序太阳码的实现方案
2022/06/01 Java/Android