innerHtml、innerText与outerHtml三者的区别
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>innerHTML、innerText与outerHTML的区别</title>
</head>
<body>
<div id="test">
<span style="color:#FF6600">test1</span>
<span style="color:#FF0000">test2</span>
</div>
<a href="javascript:alert(test.innerHTML)">innerHTML内容</a>
<a href="javascript:alert(test.innerText)">innerText内容</a>
<a href="javascript:alert(test.outerHTML)">outerHTML内容</a>
<a href="javascript:alert(test.outerText)">outerHTML内容</a>
</body>
</html>
在JS中可以使用：
test.innerHTML:
也就是从对象的起始位置到终止位置的全部内容,包括Html标签。
上例中"innerHTML内容"的值也就是
<span style="color:#FF6600">test1</span><span style="color:#FF0000">test2</span>
test.innerText:
从起始位置到终止位置的内容, 但它去除Html标签
上例中"innerText内容"的值也就是“test1 test2”, 其中span标签去除了。
test.outerHTML:
除了包含innerHTML的全部内容外, 还包含对象标签本身。
上例中的"outerHTML内容"的值也就是
<div id="test">
<span style="color:#FF6600">test1</span>
<span style="color:#FF0000">test2</span>
</div>
test.outerText:
返回的也是 "test1 test2"
- 大小: 5.3 KB
分享到：
相关推荐
js中innerHTML与innerText的用法与区别
js中innerHTML与innerText的用法与区别js中innerHTML与innerText的用法与区别
html js innerHTML outerHTML innerText outerText 等的区别及实例汇总
innerhtml用法 innertext用法 以及innerHTML与innertext的区别，看完这个大家以后在实际应用中，就可以选择合适的方法。尽可能的考虑到兼容性。
innerText和innerHtml看字面也应该理解的了
innerHTML、outerHTML、innerText、outerText的用法与区别
主要介绍了javascript中innerText和innerHTML属性用法,实例分析了javascript中innerText和innerHTML属性的作用和相关的使用技巧,需要的朋友可以参考下
innerHTML-outerHTML-innerTEXT
InnerHtml和InnerText的区别分析小结
其中innerText特性用来修改起始标签和结束标签之间的文本的。例如，假设有个空的元素，希望将其变成<div>New text for the div.。用DOM实现时，要这么做： oDiv.appendChild(document.createTextNode(“New text for...
本篇主要是对innerHTML,outerHTML,innerText,outerText的用法及区别进行了详细的介绍，需要的朋友可以过来参考下，希望对大家有所帮助
document对象中有innerHTML、innerText这两个属性，都是获取document对象文本内容，但使用起来还是有区别的； 1） innerHTML设置或获取标签所包含的HTML+文本信息(从标签起始位置到终止位置全部内容，包括HTML标签，...
...而对对象DH的改变用了innerHTML属性，它除了有innerText的作用外，还可改变对象DH内部的HTML语句，于是它把文本变成了“我姓肖!”，而且文本输出改成了斜体（<i></i>）并下加一条直线（<u><
innerHTML，outerHTML,innerTEXT三者之间的区别