textContent,innerText, 查询或者设置元素的文本内容。

textContent如,html:

<p>test gogo</p>

javascript中:

var p0 = document.getElementsByTagName("p")[0];
//查询文本内容
var txt = p0.textContent;
//设置文本内容
p0.textContent = "hello world!";

说说两者的支持者。

textContent属性【标准】,除了IE的所有浏览器都支持,innerText除了Firefox的所有浏览器属性都支持,而在IE中,用innerText代替textContent属性。

注意,两者的不同点:textContent属性将指定的元素的所有后代text节点串联在一起。innerText指定不明确,且不返回<script>元素的内容,忽略多余空白,试图保留表格格式,针对表格元素,只有只读属性,不具备设置【写】文本内容的属性。

文本内容的读写操作;

 /**
*
* @param element 元素节点
* @param value 写入的文本
* @returns {*}
*/
function textContent(element, value){
var content = element.textContent;
if(value === undefined){//读
if(content !== undefined){//功能检测
return content;
}else{//IE
return element.innerText;
}
}else{//写
if(content !== undefined){
element.textContent = value;
}else{
element.innerText = value;
}
}
}

textContent和innerHtml的更多相关文章

  1. textContent、innerHTML、innerText、outerText、outerHTML、nodeValue使用场景和区别

    今天要讲的这些属性都可以用来获取某个元素的内容,你可能会觉得不可思议,或是说上一句"丧心病狂"也.但当你看完以下内容后,会发现除outerText无用外,其他的都有各自的使用场景, ...

  2. js innerText、textContent、innerHTML的区别和各自用法

    //自定义函数 function my$(id) { return document.getElementById(id); } //点击按钮设置div中的文本内容 my$("btn&quo ...

  3. JS魔法堂:被玩坏的innerHTML、innerText、textContent和value属性

    一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它(修正:FF45+已经支持innerText属性),一般情况下我们可以使用textContent来代替,但它两者 ...

  4. [转]被玩坏的innerHTML、innerText、textContent和value属性

    一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它,一般情况下我们可以使用textContent来代替,但它两者是否就能完全等同呢?在坑爹的表单元素(如input ...

  5. textContent 与innerText

    转自下面这位大神: http://zhangyaochun.iteye.com/blog/1391370 其实关于这textContent与innerText有很多碎碎的东西,不过个人觉得还是一个不错 ...

  6. vue-learning:12 - 2 - 区分:outerHTML - innerTHML - outerText - innerText - textContent

    区分:outerHTML - innerTHML - outerText - innerText - textContent 获取值 <div id="outer"> ...

  7. 【ToolKit】轻量级JS库

    优点: 丢弃了一些不常用的方法(jQuery.fn):slideUp.fadeIn.animate等: 新增获取子节点的方法(ToolKit.fn):firstChild,lastChild等: 新增 ...

  8. jQuery-1.9.1源码分析系列(十一) DOM操作

    DOM操作包括append.prepend.before.after.replaceWith.appendTo.prependTo.insertBefore.insertAfter.replaceAl ...

  9. js中兼容性问题的封装(能力检测)

    所谓兼容性,就是看浏览器是否支持当前对象的属性或是方法,先通过获得页面文本内容的方式来了解兼容性,并封装函数或对象以解决此类问题. 获得页面文本内容的方式:innnerText 或textConten ...

随机推荐

  1. instance variables may not be placed in categories

    Avoid Properties in Categories Objective-C分类中是不允许增加成员变量的(Instance variables may not be placed in cat ...

  2. BZOJ 1024 SCOI 2009 生日快乐 深搜

    题目大意:有一块蛋糕,长为X,宽为Y.如今有n个人来分这块蛋糕,还要保证每一个人分的蛋糕的面积相等.求一种分法,使得全部的蛋糕的长边与短边的比值的最大值最小. 思路:刚拿到这个题并没有什么思路.可是定 ...

  3. 如何生成log新信息背景图片和在图片上添加水印

    在图片上添加文字水印,其实就是要用到两个类, using System.Drawing;             using System.Drawing.Drawing2D; 废话不多说了,直接上代 ...

  4. CSS display属性的值及作用

    display 的属性值有:none|inline|block|inline-block|list-item|run-in|table|inline-table|table-row-group|tab ...

  5. Lua的元方法__newindex元方法

    上一篇介绍了__index元方法,总结来说:__index元方法是用于处理访问table中不存在的字段时的情况. 而今天,介绍的__newindex元方法,总结来说,就是:用于处理给table中不存在 ...

  6. 灵光一闪-VS设计界面能访问到private修饰的各种控件

    大家都知道,用VS设计界面时,VS默认控件的访问修饰符为private,但是我就很奇怪,private修饰的字段不是只有类内部才能访问吗? 好神奇的VS,这到底是怎么实现的?难道就是类似文本编辑器的作 ...

  7. Centos6.5源码编译安装nginx

    1.安装pcre下载地址:http://jaist.dl.sourceforge.net/project/pcre/pcre/8.38/pcre-8.38.tar.gz #tar -axvf pcre ...

  8. Apache新版配置虚拟主机的注意事项

    1.关于没有默认索引文件(index.php或者index.html)时,列出目录:需要开启模块 LoadModule autoindex_module modules/mod_autoindex.s ...

  9. jquery学习(2)--选择器

    jquery-李炎恢学习视频学习笔记.自己手写. 简单的选择器    css 写 法: #box{ color:#f00;}    //id选择器    jquery获取:$('#box').css( ...

  10. 数据库课本SQL第三章答案

    3 .用 sQL 语句建立第二章习题 5 中的 4 个表. 答: 对于 S 表: S ( SNO , SNAME , STATUS , CITY ) ; 建 S 表: CREATE TABLE S ( ...