js中innerHTML,innerText,outerHTML的用法和区别


用法:

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

JS中可以使用:

test.innerHTML:

  也就是从对象的起始位置到终止位置的全部内容,包括Html标签。


  上例中的test.innerHTML的值也就是“<spanstyle="color:red">test1</span> test2 ”

test.innerText:

  从起始位置到终止位置的内容, 但它去除Html标签

  上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。


test.outerHTML:

  除了包含innerHTML的全部内容外, 还包含对象标签本身。

  上例中的text.outerHTML的值也就是<div id="test"><spanstyle="color:red">test1</span> test2</div>


完整示例:

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

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

 

posted @ 2013-06-13 00:37  廖世勇  阅读(140)  评论(0编辑  收藏  举报