cleanWhitespace
cleanWhitespace(element) -> HTMLElement
移除元素中所有仅包含空白的文本节点,返回移除空白文本节点后的元素。
译注:所谓空白文本节点,是根据 XML 中的概念得来的,例如,有以下 HTML 代码:
<div>
<p>第一段</p>
</div>
<div> 的子节点(element.childNodes)包括 <p> 和空白文本节点(对于空白文本节点,各种浏览器的处理方式不一样),
这些空白文本节点有时对处理节点的顺序关系会造成影响,如上述 HTML 代码中我们通常认为 <p> 没有前导和后继兄弟节点,
但因为空白文本节点的干扰,程序可能会认为 <p> 有一个前导兄弟节点和一个后继兄弟节点。为消除这些干扰因素,Prototype
提供了 cleanWhitespace
方法,用于去除无用的空白文本节点。
Element.cleanWhitespace
移除仅包含空白的文本节点。这对于使用一些原生的标准方法如 nextSibling
、
previousSibling
、firstChild
或 lastChild
来操作 DOM 时特别有用。
如果只想访问元素节点(不包括文本节点),试试这些方法:Element.up、 Element.down、Element.next 和 Element.previous 。千万不要错过。
样例
思考一下下面这段 HTML 片断:
<ul id="apples">
<li>Mutsu</li>
<li>McIntosh</li>
<li>Ida Red</li>
</ul>
想一下如何获取第一个列表项目:
var element = $('apples');
element.firstChild.innerHTML;
// -> undefined
这并不一定会正确的工作。为什么?因为 ul#apples
的第一个子节点实际上是一个仅包含空白的文本节点,它位于
<ul id="apples">
和 <li>Mutsu</li>
之间。
让我们移除所有这些无用的空白:
element.cleanWhitespace();
这使得 DOM 看起来类似于下面这样:
<UL id="apples"><LI>Mutsu</LI><LI>McIntosh</LI><LI>Ida Red</LI></UL>
现在 firstChild
终于按照期望的方式工作了!
element.firstChild.innerHTML;
// -> 'Mutsu'