获取元素的内容
(1)操作元素内的文本
假如有HTML代码：<p>some content text</p>，有以下几种方法可以操作元素P内的文本：
一种方式是通过DOM的方式： domElem.firstChild.nodeValue,该方式只能操作第一段文本。
另一种则是通过innerText属性获得，通过innerText属性可以操作元素中包含的所有文本内容，无论文本位于文档树中的什么位置。在通过innerText读取值时，它会按照由浅入深的顺序，将子文档树的所有文本拼接起来。
如果我们想要设置innerText,则简单的通过elem.innerText = xxx;即可； 但是要注意2点：
（1）设置innerText会改变元素的DOM结构，元素的所有子节点完全被替换为设置的文本节点。
（2）若设置的文本内容含有HTML标签，则会被相应的转义。如果我们想要去掉节点内的所有HTML标签，则可以简单的设置
elem.innerText = elem.innerText;
在FF下DOM节点是没有innerText属性的，FF下则是用textContent作为innerText的等价物，textContent是DOM3级规定的一个属性，得到了Safari、Opera、Chrome、FF的支持，同时Safari、Opera、Chrome也支持innerText，IE仅支持innerText。因此，我们可以封装一对getInnerText/setInnerText函数作为统一接口获得我们想要的节点下的文本。
我们以下面代码为例总结下innerText的特性：
<mce:script type="text/javascript"><!-- /* * @param {Object} elem * 获取参数elem元素内的文本内容 */ var getInnerText = function(elem) { return typeof elem.textContent == "string" ? elem.textContent : elem.innerText ; }; /* * 设置elem元素内的文本节点为contentStr */ var setInnerText = function(elem, text) { if(typeof elem.textContent == "string") { elem.textContent = text; } else { elem.innerText = text; } }; window.onload = function(){ var div = document.getElementsByTagName('div')[0], p = document.getElementsByTagName('p')[0]; var divtext = getInnerText(div), ptext = getInnerText(p); /*由于各浏览器处理空白符方式不同，输出的文本可能会也可能不会包含原始HTML代码中的缩进*/ alert(divtext);//输出div here! something here! alert(ptext);//输出something here! setInnerText(p, 'something other!'); //设置p标签的文本节点 alert(getInnerText(p)); //输出something other! setInnerText(div, '<p>div change</p>'); //设置div的innerText,相关的HTML标签会被转义 alert(getInnerText(div));//输出<p>div change</p> setInnerText(document.body, getInnerText(document.body));//将body的innerText设置为自身以过滤标签 alert(getInnerText(document.body));//输出<p>div change</p> }; // --></mce:script> <html> <body> <div> div here! <p> something here! </p> </div> </body> </html>
（2）操作元素内的HTML
与innerText对应的，通过innerHTML可以快速的操作元素的所有子节点，这个属性在所有现在浏览器中都实现了。与innerText的主要区别就是：获取innerText时，是把所有子节点下的文本节点连接起来返回，而innerHTML则是返回完整的HTML结构；设置时，innerText会转义HTML标签，而innerHTML则不会。因此通过设置innerHTML可以快速的操作元素结构。
86
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
