当前位置: 首页 > 图文教程 > 网络编程 > Javascript > innerHTML和innerText的使用方法

Javascript
VB倒计时器和JS当前时间
如何显示当天日期
一种JavaScript的设计模式
js变量作用域及可访问性的探讨
在JavaScript中实现命名空间
删除重复数据的算法
Javascript操纵Cookie实现购物车程序
键盘控制事件应用教程大全
通过JAVASCRIPT读取ASP设定的COOKIE
用函数式编程技术编写优美的 JavaScript
最简短的拖动对象代码实例演示
禁止刷新,回退的JS
js验证表单大全
js验证表单第二部分
DHTML 中的绝对定位
解决FireFox下[使用event很麻烦]的问题
准确获得页面、窗口高度及宽度的JS
js获取单选按钮的数据
检测屏幕分辨率
双击滚屏-常用推荐

Javascript 中的 innerHTML和innerText的使用方法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 483 ::
收藏到网摘: n/a

用法:

<div id="test">
<span style="color:red">test1</span> test2
</div>

 在JS中可以使用:

test.innerHTML:

  也就是从对象的起始位置到终止位置的全部内容,包括Html标签。
  上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> test2 ”。

test.innerText:

  从起始位置到终止位置的内容, 但它去除Html标签
  上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。

test.outerHTML:

  除了包含innerHTML的全部内容外, 还包含对象标签本身。
  上例中的text.outerHTML的值也就是<div id="test"><span style="color:red">test1</span> test2</div>

完整示例:

<div id="test">
<span style="color:red">test1</span> test2
</div>

<a href="javascript:alert(test.innerHTML)">innerHTML内容</a>
<a href="javascript:alert(test.innerText)">inerHTML内容</a>
<a href="javascript:alert(test.outerHTML)">outerHTML内容</a>

特别说明:

  innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器,因此,尽可能地去使用 innerHTML,而少用innerText,如果要输出不含HTML标签的内容,可以使用innerHTML取得包含HTML标签的内容后,再用正则表达式去除HTML标签,下面是一个简单的符合W3C标准的示例:

<a href="javascript:alert(document.getElementById('test').innerHTML.replace(/<.+?>/gim,''))">无HTML,符合W3C标准</a>