日期:2014-05-17  浏览次数:20573 次

outerHTML指什么?outerText呢?
outerHTML指什么?outerText呢?
为什么下面代码:
<html>
<head>
</head>
<body   id= "aaa ">
<p   id= "test1 ">
<div>
<font   color= "red "> 浙江 </font>
<div>   杭州   </div>
</div>
</p>

<div> 你好啊
</div>
</body>
</html>
<script>
alert(document.getElementById( "test1 ").innerHTML);
alert(document.getElementById( "test1 ").innerText);
alert(document.getElementById( "test1 ").outerText);
alert(document.getElementById( "test1 ").outerHTML);


</script>
运行的结果不是理想中的?

------解决方案--------------------
xxxHTML是指包括html代码的部分,xxxText指去掉html标记的文字
------解决方案--------------------
得到的值为空是由于 <p> 和 <div> 嵌套使用造成的。改成如下方式就没问题:
<html>
<head>
</head>
<body>
<p>
<div id= "test1 ">
<font color= "red "> 浙江 </font>
<div> 杭州 </div>
</div>
</p>

<p id= "test2 "> <b> 你好啊 </b>
</p>
</body>
</html>
<script>
alert(document.getElementById( "test1 ").innerText);
alert(document.getElementById( "test1 ").innerHTML);
alert(document.getElementById( "test1 ").outerText);
alert(document.getElementById( "test1 ").outerHTML);

alert(document.getElementById( "test2 ").outerHTML);
</script>

</BODY>
</HTML>
=================
outerHTML是相对于innerHTML的。
outerHTML包含本标签HTML代码,比如test2的innerHTML是: <b> 你好啊 </b> ;
test2的outerHTML则为: <p id= "test2 "> <b> 你好啊 </b> </p> ;

关于innerText和outerText,查了资料,唯一的区别说是innerText只存在于成对的那种标签,比如 <div> </div> 、 <td> </td> 中……
做了试验,没试出来,不知道是不是我理解的不对 :\