首页 > javascript > javascript DOM 之createTreeWalker 搜索优化
201007月13

javascript DOM 之createTreeWalker 搜索优化

javascript DOM Level 2 之createTreeWalker 深度搜索节点

注意:createTreeWalker和createNodeIterator都不支持IE6

function makelist(id,showid)
{
var oDiv = document.getElementById(id);
var oFilter = new Object;
oFilter.acceptNode = function (oNode)
{
 
//用于过滤禁止的tagName
return (oNode.tagName == "P" ) ? NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT ;
};
walker = document.createTreeWalker(oDiv,NodeFilter.SHOW_ELEMENT,oFilter,false);
var output = document.getElementById(showid);
var oNode = walker.nextNode();
var str='',innerTextStr='';
while(oNode)
{
 
innerTextStr = (oNode.innerText)? oNode.innerText : oNode.textContent;
str += oNode.tagName+':'+innerTextStr+'\n';
oNode = walker.nextNode();
};
output.innerHTML=str;
 
}
<div id="a1">1</div>
<div id="a2">2</div>
<div id="a3">3</div>
 
<div id="list">
<p>hello <strong>word</strong></p>
<ul>
<li>list 1</li>
<li>list 2</li>
<li>list 3</li>
 
</ul>
 
</div>
<div id="showNode"></div>
<input type="button" onclick="makelist('list','showNode')" value="显示节点" />

本文地址:http://jqueryajax.com/jquery-864.html , 转载请保留.

本文目前尚无任何评论.

发表评论

订阅到 Google 订阅到鲜果 订阅到QQ 邮件订阅 订阅到抓虾