Si j'ai deux nœuds dans un document HTML, comment puis-je dire lequel est-ce que l'on veut d'abord dans l'ordre de document HTML en JavaScript à l'aide des méthodes DOM?
Par exemple, P>
function funstuff(a, b) {
//a and b can be any node in the DOM (text, element, etc)
if(b comes before a in document order) {
var t = b; b = a; a = t;
}
// process the nodes between a and b. I can handle this part
// when I know that a comes before b.
}
3 Réponses :
plutôt difficile, je voudrais personnellement iTérence chaque arbre jusqu'à ce que je trouvais un anster commun, puis vérifiez quel nœud parent (ou le noeud réel si tel est faible) commence par commencer par le premier enfant et le travail à travers des frères et sœurs, quelque chose comme:
function OrderCheck(node1, node2){
var ar1 = [null, node1];
var ar2 = [null, node2];
for(var i = 1; ar1[i] != null; i++)
ar1[i+1]=ar1[i].parentNode;
for(var i = 1; ar2[i] != null; i++)
ar2[i+1]=ar2[i].parentNode;
ar1.reverse(); ar2.reverse(); // easier to work with.
i = 0;
while( ar1[i] === ar2[i] ){
if(ar1[i] === null)
return 0;
else
i++
}
if(ar1[i] === null)
return 2;
if(ar2[i] === null)
return 1;
if(i != 0){
var n = ar1[i-1].firstChild;
do{
if(n === ar1[i])
return 1;
if(n === ar2[i])
return 2;
}while(n = n.nextSibling);
}
return -1;// Shouldn't happen.
}
var order = OrderCheck(document.body, document.body.previousSibling);
if( order == 1){
// element 1 first
}else if(order == 2){
// element 2 first
}else{
// there was an error.
}
Belle réponse, mais je pense que cela échoue si un nœud est l'ancêtre de l'autre. Vous devez tester «i» allant au-delà de la longueur de l'un des matrices.
C'est une idée très intéressante, beaucoup plus efficace que celle que j'avais pensée. Je vais l'inclure comme une chute si A.CachedocumentPosition n'est pas définie (c'est une méthode DOM 3). Merci!
Vous pouvez utiliser la fonction DOM Comparécumentation Code> a > qui retournera différents numéros basés sur les deux relations des nœuds:
DOCUMENT_POSITION_DISCONNECTED = 0x01;
DOCUMENT_POSITION_PRECEDING = 0x02;
DOCUMENT_POSITION_FOLLOWING = 0x04;
DOCUMENT_POSITION_CONTAINS = 0x08;
DOCUMENT_POSITION_CONTAINED_BY = 0x10;
Notez que ComparécumpentationPosition n'est pris en charge par aucune version d'Internet Explorer, à savoir IE 8.
Je pense que la solution complète sera de revenir au code de Scragar s'il n'est pas défini. Merci pour le conseil.
// Compare Position - MIT Licensed, John Resig
function comparePosition(a, b){
return a.compareDocumentPosition ?
a.compareDocumentPosition(b) :
a.contains ?
(a != b && a.contains(b) && 16) +
(a != b && b.contains(a) && 8) +
(a.sourceIndex >= 0 && b.sourceIndex >= 0 ?
(a.sourceIndex < b.sourceIndex && 4) +
(a.sourceIndex > b.sourceIndex && 2) :
1) +
0 :
0;
}
Il convient de noter que la méthode de la RESIG ne fonctionnera que sur les nœuds d'éléments, pas sur les nœuds de texte.
Oui. Les nœuds de texte n'ont pas .sourceindex et ils n'ont pas .Contient ().
&& ne fait rien dans tous ces cas, car le RHS est toujours vrai.