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 相关文章推荐
理解Javascript闭包
Nov 01 Javascript
JS取request值以及自动执行使用示例
Feb 24 Javascript
JavaScript编程中容易出BUG的几点小知识
Jan 31 Javascript
jQueryMobile之Helloworld与页面切换的方法
Feb 04 Javascript
深入理解JavaScript系列(34):设计模式之命令模式详解
Mar 03 Javascript
基于jQuery实现的扇形定时器附源码下载
Oct 20 Javascript
JS实现微信摇一摇原理解析
Jul 22 Javascript
微信小程序button组件使用详解
Jan 31 Javascript
关于node-bindings无法在Electron中使用的解决办法
Dec 18 Javascript
从0到1搭建element后台框架优化篇(打包优化)
May 12 Javascript
原生js实现的移动端可拖动进度条插件功能详解
Aug 15 Javascript
JS用最简单的方法实现四舍五入
Aug 27 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
无JS,完全php面向过程数据分页实现代码
2012/08/27 PHP
php对二维数组进行排序的简单实例
2013/12/19 PHP
php 获取页面中指定内容的实现类
2014/01/23 PHP
php实现生成code128条形码的方法详解
2017/07/19 PHP
PHP封装的XML简单操作类完整实例
2017/11/13 PHP
PHP abstract 抽象类定义与用法示例
2018/05/29 PHP
javascript cookies操作集合
2010/04/12 Javascript
使用JQuery快速实现Tab的AJAX动态载入(实例讲解)
2013/12/11 Javascript
javascript学习笔记之10个原生技巧
2014/05/21 Javascript
JavaScript中操作字符串之localeCompare()方法的使用
2015/06/06 Javascript
Nodejs爬虫进阶教程之异步并发控制
2016/02/15 NodeJs
使用Javascript实现选择下拉菜单互移并排序
2016/02/23 Javascript
jQuery中show与hide方法用法示例
2016/09/16 Javascript
Servlet实现文件上传,可多文件上传示例
2016/12/05 Javascript
Vue.js双向绑定实现原理详解
2016/12/22 Javascript
Bootstrap模态框插入视频的实现代码
2017/06/25 Javascript
vue实现点击图片放大效果
2017/08/15 Javascript
基于IView中on-change属性的使用详解
2018/03/15 Javascript
解决vue页面DOM操作不生效的问题
2018/03/17 Javascript
JS对象与json字符串相互转换实现方法示例
2018/06/14 Javascript
详解KOA2如何手写中间件(装饰器模式)
2018/10/11 Javascript
vue webpack重写cookie路径的方法
2019/07/10 Javascript
微信小程序引入模块中wxml、wxss、js的方法示例
2019/08/09 Javascript
vue制作toast组件npm包示例代码
2020/10/29 Javascript
jupyter notebook运行命令显示[*](解决办法)
2020/05/18 Python
python 制作磁力搜索工具
2021/03/04 Python
公务员职业生涯规划书范文  
2014/01/19 职场文书
大学社团计划书
2014/05/01 职场文书
核心价值观演讲稿
2014/05/13 职场文书
求职信内容怎么写
2014/05/26 职场文书
和谐社区口号
2014/06/19 职场文书
公司授权委托书范文
2014/09/21 职场文书
祖国在我心中演讲稿600字
2014/09/23 职场文书
干部考察材料范文
2014/12/24 职场文书
电信营业员岗位职责
2015/04/14 职场文书
python中print格式化输出的问题
2021/04/16 Python