Les add () et appendChild () sont-ils identiques pour certains objets DOM?

Je travaille sur une petite application Web qui modifie le contenu d'une liste déroulante sélectionnée.

Je me demandais si appendChild () et add () accomplissent la même tâche sur un objet DOM sélectionné en JavaScript?

var someSelect = document.getElementById('select-list'); var newOption = document.createElement('option'); someSelect.appendChild(newOption); // The above is the same as the following? someSelect.add(newOption);

Dans ce cas, je crois qu'ils accompliraient la même tâche.

add( ) est fourni spécialement via l' interface HTMLSelectElement spécifiquement pour ajouter des options à un élément select et dispose de quelques options supplémentaires (comme un index optionnel pour ajouter la nouvelle option , etc.).

appendChild( ) vous donnera une appendChild( ) directe du nœud enfant.

Faites attention aux différentes implémentations des deux méthodes cross-browser: je pense que ce serait votre plus grand point de douleur. IIRC, les IE causeraient des problèmes lors de l'ajout d'enfants pour select s, donc vous pouvez add si cette méthode existe et revenir sur appendChild .

Si vous souhaitez être sûr de la compatibilité entre les navigateurs lors de la manipulation des options dans un <select> , le moyen le plus sûr est d'utiliser sa propriété d' options et de la remplir avec les objets Option . La méthode décisive suivante fonctionne dans tous les navigateurs scriptables depuis la fin des années 1990:

 var options = select.options; options[options.length] = new Option("Option text", "option_value");

Je pense que cela devrait être équivalent, mais ici, vous pouvez trouver une question qui remarque les différentes implémentations lorsque vous essayez de travailler avec des groupes d'options:

CHOIX SELECT: sur l'élément IE est ajouté à OptGroup au lieu de root. FF ok

IE ne parvient pas à ajouter une nouvelle option "dans la racine" lorsqu'il existe déjà un groupe dans l'élément select.