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解决下拉框select设宽度时IE 6/7/8下option超出显示不全
May 27 Javascript
jquery选择器大全 全面详解jquery选择器
Mar 06 Javascript
JSON取值前判断
Dec 23 Javascript
使用postMesssage()实现跨域iframe页面间的信息传递方法
Mar 29 Javascript
微信小程序 详解页面跳转与返回并回传数据
Feb 13 Javascript
bootstrap table实现单击单元格可编辑功能
Mar 28 Javascript
详谈js对url进行编码和解码(三种方式的区别)
Aug 16 Javascript
vue2.0 如何把子组件的数据传给父组件(推荐)
Jan 15 Javascript
Javascript 编码约定(编码规范)
Mar 11 Javascript
jQuery实现左右两个列表框的内容相互移动功能示例
Jan 27 jQuery
小程序绑定用户方案优化小结
May 15 Javascript
微信小程序3种位置API的使用方法详解
Aug 05 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
PHP新手上路(三)
2006/10/09 PHP
php 空格,换行,跳格使用说明
2009/12/18 PHP
php设计模式 Template (模板模式)
2011/06/26 PHP
利用Homestead快速运行一个Laravel项目的方法详解
2017/11/14 PHP
PHP实现数组根据某个字段进行水平合并,横向合并案例分析
2019/10/08 PHP
关于juqery radio写法的兼容性问题(新老版本jquery)
2010/06/14 Javascript
jquery创建并行对象或者合并对象的实现代码
2012/10/10 Javascript
基于jquery实现的文字淡入淡出效果
2013/11/14 Javascript
为指定的元素添加遮罩层的示例代码
2014/01/15 Javascript
Jquery动态添加输入框的方法
2015/05/29 Javascript
js中最容易被忽视的事件问题大总结
2016/05/15 Javascript
AngularJs自定义服务之实现签名和加密
2016/08/02 Javascript
详解Vue方法与事件
2017/03/09 Javascript
jQuery插件HighCharts绘制简单2D柱状图效果示例【附demo源码】
2017/03/21 jQuery
深入理解Angularjs中$http.post与$.post
2017/05/19 Javascript
js微信分享实现代码
2020/10/11 Javascript
详谈js原型继承的一些问题
2017/09/06 Javascript
浅谈React 服务器端渲染的使用
2018/05/08 Javascript
解决Angular2 router.navigate刷新页面的问题
2018/08/31 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
jQuery冲突问题解决方法
2021/01/19 jQuery
有关wxpython pyqt内存占用问题分析
2014/06/09 Python
python正则表达式的使用
2017/06/12 Python
通过selenium抓取某东的TT购买记录并分析趋势过程解析
2019/08/15 Python
python3实现微型的web服务器
2019/09/03 Python
Python 类属性与实例属性,类对象与实例对象用法分析
2019/09/20 Python
Python计算公交发车时间的完整代码
2020/02/12 Python
美国领先的医疗警报服务:Philips Lifeline
2018/03/12 全球购物
Tom Dixon官网:英国照明及家具设计和制造公司
2019/03/01 全球购物
法律工作求职自荐信
2013/10/31 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
给老婆的检讨书(搞笑版)
2015/05/06 职场文书
小学教师教学随笔
2015/08/14 职场文书
竞聘开场白方式有哪些?
2019/08/28 职场文书
导游词之任弼时故居
2020/01/07 职场文书
在windows server 2012 r2中安装mysql的详细步骤
2022/07/23 Servers