JQuery获取与设置HTML元素的内容或文本的实现代码


Posted in Javascript onJune 20, 2014

先来看看演示效果:

欢迎访问三水点靠木PHP教程

  • 三水点靠木PHP教程
  • 简单易懂的JavaScript魔法
  • 简单易懂的JQuery魔法

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("欢迎您访问三水点靠木教程~~");

要注意下面两点:

1.JavaScript中的innerText属性并不能在Firefox浏览器下运行,而jQuery的text()方法支持所有的浏览器.
2.text()方法对HTML文档和XML文档都有效。

Javascript 相关文章推荐
JQuery 1.4 中的Ajax问题
Jan 23 Javascript
EasySlider 基于jQuery功能强大简单易用的滑动门插件
Jun 11 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
Jan 03 Javascript
jQuery实现信息提示框(带有圆角框与动画)效果
Aug 07 Javascript
分享有关jQuery中animate、slide、fade等动画的连续触发、滞后反复执行的bug
Jan 10 Javascript
聊一聊JavaScript作用域和作用域链
May 03 Javascript
Bootstrap3学习笔记(二)之排版
May 20 Javascript
全面了解JavaScript的数据类型转换
Jul 01 Javascript
关于js原型的面试题讲解
Sep 25 Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
Jan 19 Javascript
layui 根据后台数据动态创建下拉框并同时默认选中的实例
Sep 02 Javascript
三剑客:offset、client和scroll还傻傻分不清?
Dec 04 Javascript
jquery获取html元素的绝对位置和相对位置的方法
Jun 20 #Javascript
confirm的用法示例用于按钮操作时确定是否执行
Jun 19 #Javascript
javascript 控制input只允许输入的各种指定内容
Jun 19 #Javascript
$(document).ready(function() {})不执行初始化脚本
Jun 19 #Javascript
对之前写的jquery分页做下升级
Jun 19 #Javascript
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
Jun 19 #Javascript
jQuery常用操作方法及常用函数总结
Jun 19 #Javascript
You might like
mysql总结之explain
2012/02/27 PHP
php全局变量和类配合使用深刻理解
2013/06/05 PHP
php+mysql实现用户注册登陆的方法
2015/01/03 PHP
PHP获取一段文本显示点阵宽度和高度的方法
2015/03/12 PHP
php给每个段落添加空格的方法
2015/03/20 PHP
PHP Hash算法:Times33算法代码实例
2015/05/13 PHP
PHP判断FORM表单或URL参数来的数据是否为整数的方法
2016/03/25 PHP
php版微信返回用户text输入的方法
2016/11/14 PHP
PHP设计模式之状态模式定义与用法详解
2018/04/02 PHP
JavaScript的目的分析
2007/01/05 Javascript
jQuery链使用指南
2015/01/20 Javascript
javaScript中Math()函数注意事项
2015/06/18 Javascript
JavaScript实现cookie的写入、读取、删除功能
2015/11/05 Javascript
jquery实现树形菜单完整代码
2015/12/29 Javascript
用window.onerror捕获并上报Js错误的方法
2016/01/27 Javascript
javascript实现dom元素可拖动
2016/03/21 Javascript
Jquery基础之事件操作详解
2016/06/14 Javascript
javaScript中定义类或对象的五种方式总结
2016/12/04 Javascript
jQuery控制控件文本的长度的操作方法
2016/12/05 Javascript
Bootstrap源码解读媒体对象、列表组和面板(10)
2016/12/26 Javascript
js实现符合国情的日期插件详解
2017/01/19 Javascript
这样回答继承可能面试官更满意
2019/12/10 Javascript
实例讲解JavaScript 计时事件
2020/07/04 Javascript
[48:21]林俊杰圣堂刺客超神杀戮秀
2014/10/29 DOTA
python之生产者消费者模型实现详解
2019/07/27 Python
Windows下PyCharm2018.3.2 安装教程(图文详解)
2019/10/24 Python
Python 实现打印单词的菱形字符图案
2020/04/12 Python
XML文档面试题
2015/08/05 面试题
工程造价自荐信
2013/10/09 职场文书
酒店司机岗位职责
2013/12/14 职场文书
小学三年级数学教学反思
2014/01/31 职场文书
职工代表大会主持词
2014/04/01 职场文书
逃课检讨书怎么写
2015/01/01 职场文书
写给老师的感谢信
2015/01/20 职场文书
2019脱贫攻坚工作总结报告范本!
2019/08/06 职场文书
Java实现多文件上传功能
2021/06/30 Java/Android