js使用html()或text()方法获取设置p标签的显示的值


Posted in Javascript onAugust 01, 2014

html()方法

此方法类似于JavaScript中的innerHTML属性,可以用来读取或者设置某个元素中的HTML内容。要获取某个元素的内容,可以这样:

var p_html = $("p").html(); //获取p元素的HTML代码

如果需要设置某元素的HTML代码,那么也可以使用该方法,不过需要为它传递一个参数。例如要设置p元素的HTML代码,可以使用如下代码:

//设置p元素的HTML代码
$("p").html("欢迎您访问简明现代魔法图书馆~~");

注意:html()方法可以用于XHTML文档,但不能用于XML文档。

text()方法

此方法类似于JavaScript中的innerText属性,可以用来读取或者没置某个元素中的文本内容。继续使用以上的HTML代码,用text()方法对p元素进行操作:

var p_text = $("p").text(); //获取p元素的文本内容

与html()方法一样,如果需要为某元素设置文本内容,那么也需要传递一个参数。例如对p元素设置文本内容,代码如下:

// 设置p元素的文本内容
$("p").text("欢迎您访问简明现代魔法图书馆~~");

要注意下面两点:

JavaScript中的innerText属性并不能在Firefox浏览器下运行,而jQuery的text()方法支持所有的浏览器.

text()方法对HTML文档和XML文档都有效。

显示好友列表时,在显示好友名字的<p></p>元素中设置:<p id="p${friend.friendId}"></p>,这样js文件就可以动态获取<p></p>元素的id,并顺利通过text()方法赋值$("#p"+userId).text(name);

Javascript 相关文章推荐
JavaScript版代码高亮
Jun 26 Javascript
jquery中对于批量deferred的处理方法
Jan 22 Javascript
原生的html元素选择器类似jquery选择器
Oct 15 Javascript
javascript匿名函数实例分析
Nov 18 Javascript
JS逆序遍历实现代码
Dec 02 Javascript
JavaScript中连接操作Oracle数据库实例
Apr 02 Javascript
javascript合并表格单元格实例代码
Jan 03 Javascript
理解javascript模块化
Mar 28 Javascript
Vue学习笔记进阶篇之vue-cli安装及介绍
Jul 18 Javascript
vue中实现左右联动的效果
Jun 22 Javascript
JS实现的合并两个有序链表算法示例
Feb 25 Javascript
解决vue请求接口第一次成功,第二次失败问题
Sep 08 Javascript
js中的getAttribute方法使用示例
Aug 01 #Javascript
jquery append()方法与html()方法的区别及使用介绍
Aug 01 #Javascript
JS中产生20位随机数以0-9为例也可以是a-z A-Z
Aug 01 #Javascript
js控制再次点击按钮之间的间隔时间可防止重复提交
Aug 01 #Javascript
批量修改标签css样式以input标签为例
Jul 31 #Javascript
JQuery中serialize()、serializeArray()和param()方法示例介绍
Jul 31 #Javascript
jquery、js调用iframe父窗口与子窗口元素的方法整理
Jul 31 #Javascript
You might like
用PHP调用数据库的存贮过程
2006/10/09 PHP
PHP将DateTime对象转化为友好时间显示的实现代码
2011/09/20 PHP
php实现事件监听与触发的方法
2014/11/21 PHP
php模拟登陆的实现方法分析
2015/01/09 PHP
php数组实现根据某个键值将相同键值合并生成新二维数组的方法
2017/04/26 PHP
Laravel重定向,a链接跳转,控制器跳转示例
2019/10/22 PHP
网页图片延时加载的js代码
2010/04/22 Javascript
深入理解JavaScript作用域和作用域链
2011/10/21 Javascript
JQuery在页面中添加和除移DOM示例代码
2013/06/24 Javascript
js验证整数加保留小数点的简单实例
2013/12/02 Javascript
js判断是否为ie的方法小结
2014/01/13 Javascript
JS实现适合于后台使用的动画折叠菜单效果
2015/09/21 Javascript
Bootstrap每天必学之js插件
2015/11/30 Javascript
JavaScript中的原型继承基础学习教程
2016/05/06 Javascript
jQuery动态添加可拖动元素完整实例(附demo源码下载)
2016/06/21 Javascript
js 获取范围内的随机数实例代码
2016/08/02 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的方法
2016/11/29 Javascript
jQuery插件imgAreaSelect基础讲解
2017/05/26 jQuery
JS仿QQ好友列表展开、收缩功能(第一篇)
2017/07/07 Javascript
在 Typescript 中使用可被复用的 Vue Mixin功能
2018/04/17 Javascript
layui实现动态和静态分页
2018/04/28 Javascript
vue项目中使用tinymce编辑器的步骤详解
2018/09/11 Javascript
Vue实现点击显示不同图片的效果
2019/08/10 Javascript
基于vue和bootstrap实现简单留言板功能
2020/05/30 Javascript
vant时间控件使用方法详解
2020/12/24 Javascript
[01:13:01]2018DOTA2亚洲邀请赛 4.4 淘汰赛 TNC vs VG 第三场
2018/04/05 DOTA
Python 深入理解yield
2008/09/06 Python
利用ctypes提高Python的执行速度
2016/09/09 Python
python实现寻找最长回文子序列的方法
2018/06/02 Python
python中使用iterrows()对dataframe进行遍历的实例
2018/06/09 Python
Python-while 计算100以内奇数和的方法
2019/06/11 Python
美国知名运动产品零售商:Foot Locker
2016/07/23 全球购物
英国剑桥包中文官网:The Cambridge Satchel Company中国
2018/11/06 全球购物
动物学专业毕业生求职信
2013/10/11 职场文书
宿舍卫生检讨书
2014/01/16 职场文书
2015年教研组工作总结
2015/05/04 职场文书