> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트 노드 정렬 2_javascript 기술

자바스크립트 노드 정렬 2_javascript 기술

WBOY
풀어 주다: 2016-05-16 18:11:12
원래의
963명이 탐색했습니다.
코드 복사 코드는 다음과 같습니다.

//Inspired by
//http:/ /www.cnblogs.com/jkisjk/archive/2011/01/28/array_quickly_sortby.html
var hasDuplicate = false;
var sortBy = function(nodes){
var result = [], array = [], n = 노드.길이, i = n, 노드
while(노드 ​​= 노드[--n]){
(array[n] = new Number(~~node.sourceIndex) )._ = 노드 ;
}
array.sort(function(a,b){
if(a === b) hasDuplicate = true;
return a - b ;
});
while( i )
result[--i] = array[i]._;
return result;
}

하지만 표준 브라우저에서는 IE에서는 이 속성을 지원하지 않습니다. 이 경우 해당 노드의 parentNode와 nextSibling을 따라야 합니다. 그러나 이를 2개씩 비교하면 속도가 향상될 수 없습니다. 그래서 우리는 가장 최근의 공통 조상의 자녀 순서를 비교했습니다. 이때 알고리즘의 위력이 반영된다. 이것은 친구가 제공한 LCA를 기반으로 한 첫 번째 버전입니다. 물론 일반적인 아이디어는 여전히 JK의 것입니다. 하지만 실제 효과는 만족스럽지 못하며, jQuery의 sortOrder에 비해 속도가 느립니다. 문제는 LCA에 있는 것으로 추정됩니다.
코드 복사 코드는 다음과 같습니다.

//JK가 제공한 아이디어에 따르면 여기
//http://www.cnblogs.com/rubylouvre/archive/2011/01/28/1947286.html#2020900
var Tick = 0, hasDuplicate =
var Rage = {
// 양식 http://www.cnblogs.com/GrayZhang/archive/2010/12/29/find-closest-common-parent.html
getLCA:function(nodes){
var hash = {}, i = 0,
attr = "data-find"(틱),
length = node.length,
node,
parent,
counter = 0,
uuid;
while(node ​​​​= 노드[i ]){
parent = node;
while(parent){
if(parent.nodeType === 1){
break;
}
uuid = parent.getAttribute(attr);
if(!uuid){
uuid = "_"(카운터)
parent.setAttribute(attr,uuid) ;
hash[uuid ] = {node:parent,count:1};
}else{
hash[uuid].count
부모 = parentNode
}
}
for(var i in hash){
if(hash[i].count === length){
return hash[i].node
}
}
} ,
getList: function(nodes,parent){//자신을 포함하여 현재 요소에서 가장 가까운 공통 조상까지 모든 조상을 가져옵니다.
var list = []
while (노드){
if (노드 ​​=== 상위){
break
}
list.unshift(node)
node = node.parentNode
}
return list;
} ,
getLists : function(){
var listed = [], getList = Rage.getList, i=0, node, list
while(node ​​​​= 노드[i ]){
list = getList(node,parent);
if(list.length){
lists[lists.length ] = 목록
}
}
반환 목록;
},
sortList : function(a,b){
var n = Math.min(a.length,b.length),ap,bp
for; (var i=0; i < n; i ){
ap = a[i],bp = b[i]
if(ap !== bp){
while(ap = ap .nextSibling){
if(ap == = bp){
return -1
}
}
return 1
}
}
return a.length -b.length;
},
uniqueSort : function(nodes){
var length = node.length;
var LCA = Rage.getLCA(nodes); .getLists(nodes,LCA);
목록 .sort(Rage.sortList);
var list, i = 0, result = []
while(list = listed[i ]){
result[result.length] list.pop() ;
}
if(result.length !== length){
result.unshift(LAC)
if(result.length ! = length){
hasDuplicate = true;
}
}
return result;
}
}


다음은 두 번째 버전입니다. 개선되어 마침내 jQuery보다 3배 더 빨라졌습니다. (테스트 개체는 260개 이상의 노드가 있는 문서입니다.)


코드 복사 코드는 다음과 같습니다.

var hasDuplicate = false;
var Rage = {
getList : function(node){
var list = [];
while(노드){
if(node.nodeType === 9){
break;
}
list.unshift(노드);
노드 = node.parentNode;
}
반품 목록;
},
getLists : function(nodes){
var listed = [], getList = Rage.getList, i=0, node;
while(node ​​= node[i ]){
lists[lists.length ] = getList(node);
}
반품 목록;
},
sliceList : function(lists,num){
var result = [], i = 0, list;
while(list = 목록[i ]){
list = list.slice(num);
if(list.length){
결과[ result.length ] = 목록;
}
}
결과 반환;
},
sortList : function(a,b){
var n = Math.min(a.length,b.length),ap,bp;
for(var i=0; i < n; i ){
ap = a[i],bp = b[i]
if(ap !== bp){
while (ap = ap.nextSibling){
if(ap === bp){
return -1
}
}
return 1
}
}
a.길이-b.길이를 반환합니다.
},
uniqueSort : function(nodes){
var length = node.length;
var list = Rage.getLists(nodes);
lists.sort(function(a,b){
return a.length - b.length;
});
var 깊이 = 목록[0].길이, 길이 = 목록.길이, 상위, 컷, ii = 0;
for(var i =0; i parent = 목록[0][i];
컷 = 사실;
for(var j = 1;j < length; j ){
if(parent !== 목록[j][i]){
cut = false;
휴식;
}
}
if(잘라내기){
ii
}else{
break;
}
}
var LCA = 목록[0][ii-1];
lists = Rage.sliceList(lists,ii);
lists.sort(Rage.sortList);
var 목록, i = 0, 결과 = [];
while(list = 목록[i ]){
result[result.length] = list.pop();
}
if(result.length !== length){
result.unshift(LCA);
if(result.length != length){
hasDuplicate = true;
}
}
결과 반환;
}
}
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿