IEではsourceIndexを使用でき、標準ブラウザではcompareDocumentPositionを使用できますが、古い標準ブラウザではどうなるでしょうか? XML についてはどうでしょうか?したがって、ノードと別のノードの関係をその属性に基づいて判断する必要があります。
私の考えは非常に単純です。それらが同じである場合は 0 を返します (重複排除のため)。それ以外の場合は、nextSibling に基づいて 2 つのノードの順序を決定します。他の 2 つのこの祖先に最も近い 2 つの親ノード (人間の観点から見ると、叔父と父親) は、親ノードと同じ状況ではありませんか? ！彼らの順序は次の兄弟に基づいて決定され、その順序は子供の順序になります (したがって、この世襲の世界では、李剛という名前の父親がいることは非常に重要です!) ただし、最新の共通祖先が 2 人の祖先のうちの 1 つである場合もあります。パーティー、それは確かに最近のことです。
残りの問題は、最新の共通祖先を見つけることです。私の考えも非常に単純で、結局のところ、大学では数学は放棄されています。最上位の HTML 要素が元のノードとともに 2 つの配列を形成するまで、親ノードを上向きに取得し続けます。次に、比較のために毎回配列の最後の要素を取得します。同じである場合は、それらを削除します。同じでない場合は、それらの 1 つだけを取得します。
以下はテストページとソースコードです:
window.console を使用するため、Firefox、IE8、および chrome で結果を表示することをお勧めします。
を実行するために更新する必要があります]<script>
window.onload = function(){
function shuffle(a) {
var array = a.concat();
var i = array.length;
while (i) {
var j = Math.floor(Math.random()*i);
var t = array[--i];
array[i] = array[j];
array[j] = t;
}
return array;
}
var log =function(s){
window.console && window.console.log(s)
}
var sliceNodes = function(arr){
var ret = [], i = arr.length;
while (i) ret[--i] = arr[i];
return ret;
}
var sortNodes = function(a,b){
var p = "parentNode",ap = a[p],bp = b[p];
if(a === b){
return 0
}else if(ap === bp){//如果父节点相同
while(a = a.nextSibling){//比较这两兄弟
if(a === b){
return -1
}
}
return 1
}else if(!ap){
return -1
}else if(!bp){
return 1
}
var al = [], ap = a
while(ap && ap.nodeType === 1){
al[al.length] = ap
ap = ap[p]
}
var bl = [],bp = b;
while(bp && bp.nodeType === 1){
bl[bl.length] = bp
bp = bp[p]
}
ap = al.pop();
bp = bl.pop();
while(ap === bp){//去掉所有公共祖先
ap = al.pop();
bp = bl.pop();
}
if(ap && bp){//比较伯父与父亲
while(ap = ap.nextSibling){
if(ap === bp){
return -1
}
}
return 1
}
//如果是最近公共祖先与某一方进行比较
return ap ? 1 : -1
}
var els = document.getElementsByTagName("div")
els = sliceNodes(els);//转换成纯数组
log(els);
els = shuffle(els);//洗牌（模似用自定义的选择器取得的节点集合情况）
log(els);
els = els.sort(sortNodes)
log(els)
}
</script>
