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 相关文章推荐
js字符串转成JSON
Nov 07 Javascript
jquery通过a标签删除table中的一行的代码
Dec 02 Javascript
javascript使用正则控制input输入框允许输入的值方法大全
Jun 19 Javascript
点击button获取text内容并改变样式的js实现
Sep 09 Javascript
深入理解JavaScript系列(25):设计模式之单例模式详解
Mar 03 Javascript
Bootstrap~多级导航(级联导航)的实现效果【附代码】
Mar 08 Javascript
js中字符串编码函数escape()、encodeURI()、encodeURIComponent()区别详解
Apr 01 Javascript
JS实现根据用户输入分钟进行倒计时功能
Nov 14 Javascript
jQuery实现淡入淡出的模态框
Feb 09 Javascript
javaScript canvas实现(画笔大小 颜色 橡皮的实例)
Nov 28 Javascript
jQuery内容选择器与表单选择器实例分析
Jun 28 jQuery
SSM+layUI 根据登录信息显示不同的页面方法
Sep 20 Javascript
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实现水仙花数的4个示例分享
2014/04/08 PHP
Yii入门教程之Yii安装及hello world
2014/11/25 PHP
ThinkPHP实现动态包含文件的方法
2014/11/29 PHP
Laravel Validator 实现两个或多个字段联合索引唯一
2019/05/08 PHP
js 加载并解析XML字符串的代码
2009/12/13 Javascript
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
javascript中setInterval的用法
2015/07/19 Javascript
JavaScript对数组进行随机重排的方法
2015/07/22 Javascript
Node.js开发者必须了解的4个JS要点
2016/02/21 Javascript
js实现html table 行,列锁定的简单实例
2016/10/13 Javascript
JS前端加密算法示例
2016/12/22 Javascript
jQuery实现字体颜色渐变效果的方法
2017/03/29 jQuery
jQuery实现右侧抽屉式在线客服功能
2017/12/25 jQuery
详解webpack 入门与解析
2018/04/09 Javascript
Vue 按键修饰符处理事件的方法
2018/05/04 Javascript
cocos2dx+lua实现橡皮擦功能
2018/12/20 Javascript
vuex vue简单使用知识点总结
2019/08/29 Javascript
Vue解析剪切板图片并实现发送功能
2020/02/04 Javascript
Angular之jwt令牌身份验证的实现
2020/02/14 Javascript
package.json中homepage属性的作用详解
2020/03/11 Javascript
JS制作简易计算器的实例代码
2020/07/04 Javascript
Python psutil模块简单使用实例
2015/04/28 Python
基于hashlib模块--加密(详解)
2017/06/21 Python
解决出现Incorrect integer value: '' for column 'id' at row 1的问题
2017/10/29 Python
使用Python微信库itchat获得好友和群组已撤回的消息
2018/06/24 Python
利用ctypes获取numpy数组的指针方法
2019/02/12 Python
python使用pandas处理大数据节省内存技巧(推荐)
2019/05/05 Python
Python求正态分布曲线下面积实例
2019/11/20 Python
Python如何实现FTP功能
2020/05/28 Python
Python matplotlib图例放在外侧保存时显示不完整问题解决
2020/07/28 Python
HTML5实现一个能够移动的小坦克示例代码
2013/09/02 HTML / CSS
NIHAOMARKET官方海外旗舰店:意大利你好华人超市
2018/01/27 全球购物
June Jacobs尊积帕官网:知名的spa水疗护肤品牌
2019/03/21 全球购物
增员口号大全
2014/06/18 职场文书
科学发展观标语
2014/10/08 职场文书
日本官方排名前10的动漫,名侦探柯南上榜,第一是一部创造历史的动漫
2022/03/18 日漫