js 通过html()及text()方法获取并设置p标签的显示值


Posted in Javascript onMay 14, 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 相关文章推荐
WEB高性能开发之疯狂的HTML压缩
Jun 19 Javascript
理解JavaScript的变量的入门教程
Jul 07 Javascript
谈谈AngularJs中的隐藏和显示
Dec 09 Javascript
轻松搞定jQuery.noConflict()
Feb 15 Javascript
JavaScript学习笔记之数组的增、删、改、查
Mar 23 Javascript
Vue.js开发环境搭建
Nov 10 Javascript
JS实现点击Radio动态更新table数据
Jul 18 Javascript
get  post jsonp三种数据交互形式实例详解
Aug 25 Javascript
微信小程序云开发之新手环境配置
May 16 Javascript
Vue将页面导出为图片或者PDF
Aug 17 Javascript
实现一个 Vue 吸顶锚点组件方法
Jul 10 Javascript
ES6 解构赋值的原理及运用
May 25 Javascript
JQuery教学之性能优化
May 14 #Javascript
鼠标左键单击冲突的问题解决方法(防止冒泡)
May 14 #Javascript
javascript 中that的含义示例介绍
May 14 #Javascript
table insertRow、deleteRow定义和用法总结
May 14 #Javascript
jQuery 中国省市两级联动选择附图
May 14 #Javascript
全面兼容的javascript时间格式化函数(比较实用)
May 14 #Javascript
js实现图片拖动改变顺序附图
May 13 #Javascript
You might like
php设计模式 State (状态模式)
2011/06/26 PHP
php图片水印添加、压缩、剪切的封装类实现
2020/04/18 PHP
CodeIgniter多语言实现方法详解
2016/01/20 PHP
Laravel 集成微信用户登录和绑定的实现
2019/12/27 PHP
为数据添加append,remove功能
2006/10/03 Javascript
jquery中加载图片自适应大小主要实现代码
2013/08/23 Javascript
在页面上用action传递参数到后台出现乱码的解决方法
2013/12/31 Javascript
实例讲解JS中数组Array的操作方法
2014/05/09 Javascript
JSON 必知必会 观后记
2016/10/27 Javascript
ReactNative 之FlatList使用及踩坑封装总结
2017/11/29 Javascript
r.js来合并压缩css文件的示例
2018/04/26 Javascript
JavaScript字符串转数字的5种方法及遇到的坑
2018/07/16 Javascript
Vue事件修饰符native、self示例详解
2019/07/09 Javascript
JavaScript相等运算符的九条规则示例详解
2019/10/20 Javascript
关于vue里页面的缓存详解
2019/11/04 Javascript
讲解Python中的标识运算符
2015/05/14 Python
python 出现SyntaxError: non-keyword arg after keyword arg错误解决办法
2017/02/14 Python
Python+selenium 获取浏览器窗口坐标、句柄的方法
2018/10/14 Python
对pandas的层次索引与取值的新方法详解
2018/11/06 Python
Python2和Python3中urllib库中urlencode的使用注意事项
2018/11/26 Python
Python实现的文轩网爬虫完整示例
2019/05/16 Python
python使用 cx_Oracle 模块进行查询操作示例
2019/11/28 Python
python通过安装itchat包实现微信自动回复收到的春节祝福
2020/01/19 Python
Python如何避免文件同名产生覆盖
2020/06/09 Python
Python接口测试环境搭建过程详解
2020/06/29 Python
Pycharm快捷键配置详细整理
2020/10/13 Python
python获取命令行参数实例方法讲解
2020/11/02 Python
css 省略号 css3让多余的字符串消失并附加省略号的实现代码
2013/02/07 HTML / CSS
药学专业毕业生求职信
2013/10/20 职场文书
计算机软件个人的自荐信范文
2013/12/01 职场文书
文明家庭先进事迹材
2014/01/27 职场文书
大学旷课检讨书
2014/01/28 职场文书
设计师个人求职信范文
2014/02/02 职场文书
谁动了我的奶酪读书笔记
2015/06/30 职场文书
2016年小学教师政治学习心得体会
2016/01/23 职场文书
Python四款GUI图形界面库介绍
2022/06/05 Python