HTMLOptionsCollection: add() Methode

Die add() Methode des HTMLOptionsCollection-Interfaces fügt ein HTMLOptionElement oder ein HTMLOptGroupElement zu dieser HTMLOptionsCollection hinzu.

Syntax

add(item)
add(item, before)

Parameter

item: Ein HTMLOptionElement oder HTMLOptGroupElement.
before Optional: Ein Element der Sammlung oder ein numerischer, nullbasierter Index, der das Element darstellt, vor dem das item eingefügt werden soll. Wenn dieser Parameter weggelassen oder null ist oder der Index nicht existiert, wird das neue Element am Ende der Sammlung hinzugefügt.

Ausnahmen

HierarchyRequestError DOMException: Tritt auf, wenn das an die Methode übergebene item ein Vorfahre des Elements ist, in das es eingefügt werden soll.

Standardmäßig fügt add() das übergebene <option> oder <optgroup> als Parameter am Ende der Sammlung hinzu. Sie können definieren, wo das hinzugefügte <option> oder <optgroup> platziert werden soll, indem Sie den before Parameter angeben. Der before Parameter ist das <option>-Element oder ein numerischer 0-basierter Index des <option>-Elements, dem das hinzugefügte Element vorausgehen soll.

Wenn der before Parameter null oder außerhalb des gültigen Bereichs ist (oder weggelassen wird), wird das <option> oder <optgroup> als letztes Element der Sammlung hinzugefügt, außerhalb eines <optgroup>. Wenn sich das <option>, auf das der before Parameter verweist, in einem <optgroup> befindet, wird ein hinzugefügtes HTMLOptionElement in derselben Gruppe sein.

Das <optgroup> Element kann nur <option> Elemente als Kindknoten enthalten. Die add() Methode fügt erfolgreich ein HTMLOptGroupElement am Ende der HTMLOptionsCollection oder zwischen <optgroup> Elementen hinzu. Mit anderen Worten: der Versuch, ein HTMLOptGroupElement vor ein <option> innerhalb eines <optgroup> hinzuzufügen, kann stillschweigend fehlschlagen, wenn das <option>, auf das der before Parameter verweist, nicht das erste <option> innerhalb seines <optgroup> ist.

Beispiele

const optionList = document.querySelector("select").options;
const firstOption = document.createElement("option");
firstOption.text = "new item";
optionList.add(firstOption, 0); // added as the first item
optionList.add(optionList[0]); // moves the first item to the end