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来定位
Feb 20 Javascript
常用简易JavaScript函数
Apr 09 Javascript
jQuery 行级解析读取XML文件(附源码)
Oct 12 Javascript
jquery删除提示框弹出是否删除对话框
Jan 07 Javascript
java、javascript实现附件下载示例
Aug 14 Javascript
jQuery实现3D文字特效的方法
Mar 10 Javascript
原生js实现对Ajax的封装(仿jquery)
Jan 22 Javascript
浅析Javascript中双等号(==)隐性转换机制
Oct 27 Javascript
vue mounted 调用两次的完美解决办法
Oct 29 Javascript
微信小程序登录session的使用
Mar 17 Javascript
D3.js 实现带伸缩时间轴拓扑图的示例代码
Jan 20 Javascript
微信小程序后端实现授权登录
Feb 24 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
joomla实现注册用户添加新字段的方法
2016/05/05 PHP
PHP设计模式之模板方法模式实例浅析
2018/12/20 PHP
PHP序列化和反序列化深度剖析实例讲解
2020/12/29 PHP
抽出www.templatemonster.com的鼠标悬停加载大图模板的代码
2007/07/11 Javascript
clientX,pageX,offsetX,x,layerX,screenX,offsetLeft区别分析
2010/03/12 Javascript
jquery操作select option 的代码小结
2011/06/21 Javascript
Javascript学习笔记之 函数篇(三) : 闭包和引用
2014/11/23 Javascript
jquery插件orbit.js实现图片折叠轮换特效
2015/04/14 Javascript
举例说明JavaScript中的实例对象与原型对象
2016/03/11 Javascript
jQuery.datatables.js插件用法及api实例详解
2016/10/28 Javascript
微信分享调用jssdk实例
2017/06/08 Javascript
详解vue 计算属性与方法跟侦听器区别(面试考点)
2018/04/23 Javascript
Vue 实现树形视图数据功能
2018/05/07 Javascript
javascript实现对话框功能警告(alert 消息对话框)确认(confirm 消息对话框)
2019/05/07 Javascript
Vue-CLI项目中路由传参的方式详解
2019/09/01 Javascript
Vue中父子组件的值传递与方法传递
2020/09/28 Javascript
JavaScript 防抖和节流遇见的奇怪问题及解决
2020/11/20 Javascript
Python struct模块解析
2014/06/12 Python
跟老齐学Python之画圈还不简单吗?
2014/09/20 Python
Python处理JSON数据并生成条形图
2016/08/05 Python
python3学习之Splash的安装与实例教程
2018/07/09 Python
python利用selenium进行浏览器爬虫
2019/04/25 Python
python实现人工蜂群算法
2020/09/18 Python
使用CSS3编写类似iOS中的复选框及带开关的按钮
2016/04/11 HTML / CSS
CSS3下的渐变文字效果实现示例
2018/03/02 HTML / CSS
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
Nike意大利官网:Nike.com IT
2020/01/19 全球购物
医院辞职信范文
2014/01/17 职场文书
初中作文评语大全
2014/04/23 职场文书
国际贸易本科毕业生求职信
2014/09/26 职场文书
质量保证书
2015/01/17 职场文书
房地产置业顾问工作总结
2015/10/23 职场文书
2016年国庆节宣传标语
2015/11/25 职场文书
MySQL学习总结-基础架构概述
2021/04/05 MySQL
linux中nohup和后台运行进程查看及终止
2021/06/24 Python
Nginx缓存设置案例详解
2021/09/15 Servers