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 相关文章推荐
jQuery编写widget的一些技巧分享
Oct 28 Javascript
JQuery实现动态表格点击按钮表格增加一行
Aug 24 Javascript
基于jquery实现的自动补全功能
Mar 12 Javascript
AngularJS的一些基本样式初窥
Jul 27 Javascript
深入理解JS正则表达式---分组
Jul 18 Javascript
微信小程序 图片绝对定位(背景图片)
Apr 05 Javascript
jQuery遮罩层实例讲解
May 11 jQuery
微信小程序之页面跳转和参数传递的实现
Sep 29 Javascript
vue 中引用gojs绘制E-R图的方法示例
Aug 24 Javascript
require.js 加载过程与使用方法介绍
Oct 30 Javascript
antd组件Upload实现自己上传的实现示例
Dec 18 Javascript
JS实现贪吃蛇游戏
Nov 15 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 无限分类的树类代码
2009/12/03 PHP
php高级编程-函数-郑阿奇
2011/07/04 PHP
PHP的PDO预处理语句与存储过程
2019/01/27 PHP
[原创]用javascript实现检测指定目录是否存在的方法
2008/01/12 Javascript
javascript onmouseout 解决办法
2010/07/17 Javascript
浅谈js中变量初始化
2015/02/03 Javascript
JavaScript函数作用域链分析
2015/02/13 Javascript
jquery中添加属性和删除属性
2015/06/03 Javascript
jquery实现左右滑动菜单效果代码
2015/08/27 Javascript
九种原生js动画效果
2015/11/11 Javascript
每天一篇javascript学习小结(Array数组)
2015/11/11 Javascript
vue.js实现表格合并示例代码
2016/11/30 Javascript
详解webpack import()动态加载模块踩坑
2018/07/17 Javascript
jQuery事件委托代码实践详解
2019/06/21 jQuery
vue3实现v-model原理详解
2019/10/09 Javascript
使用Vue调取接口,并渲染数据的示例代码
2019/10/28 Javascript
vue限制输入框只能输入8位整数和2位小数的代码
2019/11/06 Javascript
Vue组件通信$attrs、$listeners实现原理解析
2020/09/03 Javascript
JavaScript代码简化技巧实例解析
2020/09/09 Javascript
[03:22]DOTA2超级联赛专访单车:找到属于自己的英雄
2013/06/08 DOTA
[02:20]DOTA2亚洲邀请赛 EHOME战队出场宣传片
2015/02/07 DOTA
python服务器与android客户端socket通信实例
2014/11/12 Python
使用Python的urllib2模块处理url和图片的技巧两则
2016/02/18 Python
python实现栅栏加解密 支持密钥加密
2019/03/20 Python
Django框架实现分页显示内容的方法详解
2019/05/10 Python
python实现udp聊天窗口
2020/03/31 Python
美国休闲服装品牌:J.Crew Factory
2017/03/04 全球购物
初中音乐教学反思
2014/01/12 职场文书
超市开学活动方案
2014/03/01 职场文书
2014年元旦感言
2014/03/06 职场文书
党员领导干部廉洁从政承诺书
2014/03/27 职场文书
干部作风整顿个人剖析材料
2014/10/06 职场文书
城管个人总结
2015/02/28 职场文书
起诉书范文
2015/05/20 职场文书
暑期社会实践新闻稿
2015/07/17 职场文书
ubuntu开机后ROS程序自启动问题
2022/12/24 Servers