document.all vs. document.getElementById

Question

Quand devez-vous utiliser document.all vs. document.getElementById ?

Answer 1

document.all est une extension propriétaire de Microsoft à la norme W3C.

getElementById() est standard - utilisez-la.

Toutefois, si vous utilisez une bibliothèque js comme jQuery serait utile. Par exemple, $("#id") est l'équivalent en jQuery de getElementById() . De plus, vous pouvez utiliser plus que CSS3 sélecteurs.

Answer 2

document.all est muy vieux, tu ne plus avoir à l'utiliser .

Je cite Nicholas Zakas :

Par exemple, quand le DOM était jeune, tous les navigateurs ne supportaient pas getElementById(), et donc il y avait un beaucoup de code qui ressemblait à ça :

if(document.getElementById){  //DOM
    element = document.getElementById(id);
} else if (document.all) {  //IE
    element = document.all[id];
} else if (document.layers){  //Netscape < 6
    element = document.layers[id];
}

Answer 3

En fait, document.all est seulement au minimum comparable à document.getElementById . Vous n'utiliseriez pas l'un à la place de l'autre, ils ne rendent pas les mêmes choses.

Si vous essayez de filtrer les capacités des navigateurs, vous pouvez les utiliser comme suit La réponse de Marcel Korpel comme ça :

if(document.getElementById){  //DOM
    element = document.getElementById(id);
} else if (document.all) {    //IE
    element = document.all[id];
} else if (document.layers){  //Netscape < 6
    element = document.layers[id];
}

Mais, fonctionnellement, *`document.getElementsByTagName('')** est plus équivalent à **document.all`** .

Par exemple, si vous deviez effectivement utiliser document.all pour examiner tous les éléments d'une page, comme ceci :

var j = document.all.length;
for(var i = 0; i < j; i++){
   alert("Page element["+i+"] has tagName:"+document.all(i).tagName);
}

vous utiliseriez *`document.getElementsByTagName('')`** à la place :

var k = document.getElementsByTagName("*");
var j = k.length; 
for (var i = 0; i < j; i++){
    alert("Page element["+i+"] has tagName:"+k[i].tagName); 
}

Answer 4

document.all() est une façon non standard d'accéder aux éléments du DOM. Elle a été dépréciée par quelques navigateurs. Il vous donne accès à tous les sous-éléments de votre document.

document.getElementById() est une norme et est entièrement prise en charge. Chaque élément a un identifiant unique dans le document.

Si vous avez :

<div id="testing"></div>

Utilisation de

document.getElementById("testing"); 

aura accès à cette division spécifique.

Answer 5

document.querySelectorAll (et son document.querySelector() qui renvoie le premier élément trouvé) est beaucoup, beaucoup plus puissante. Vous pouvez facilement :

• obtenir une collection entière avec document.querySelectorAll("*") en émulant de manière efficace les données non standard document.all propriété ;
• utiliser document.querySelector("#your-id") , en émulant efficacement document.getElementById() fonction ;
• utiliser document.querySelectorAll(".your-class") , en émulant efficacement document.getElementsByClassName() fonction ;
• utiliser document.querySelectorAll("form") au lieu de document.forms y document.querySelectorAll("a") au lieu de document.links ;
• et d'effectuer des requêtes DOM beaucoup plus complexes (en utilisant n'importe quel sélecteur CSS disponible) qui ne peuvent pas être couvertes par d'autres buildins de document.

L'API d'interrogation unifiée est la voie à suivre. Même si document.all serait dans la norme, c'est juste peu pratique.