optgroup element | optGroup object

Allows authors to group choices logically in a select element.

HTML information

Closing Tag	required
CSS Display	block

DOM Information

Inheritance Hierarchy

Node

Element

HTMLElement

optGroup

Members

The optGroup object has these types of members:

Events
Methods
Properties

Events

The optGroup object has these events.

Event	Description
abort	Fires when the user aborts the download.
change	Fires when the contents of the object or selection have changed.
error	Fires when an error occurs during object loading.
input	Occurs when the text content of an element is changed through the user interface.
load	Fires immediately after the client loads the object.
onselect	Fires when the current selection changes.
reset	Fires when the user resets a form.

Methods

The optGroup object has these methods.

Method	Description
click	Simulates a click by causing the onclick event to fire.
compareDocumentPosition	Compares the position of two nodes in a document.
contains	Checks whether the given element is contained within the object.
getAttributeNodeNS	Gets an attribute object that matches the specified namespace and name.
getAttributeNS	Gets the value of the specified attribute within the specified namespace.
getElementsByClassName	Gets a collection of objects that are based on the value of the class attribute.
getElementsByTagNameNS	Gets a collection of objects that are based on the specified element names within a specified namespace.
hasAttributeNS	Determines whether an attribute that has the specified namespace and name exists.
insertAdjacentHTML	Inserts the given HTML text into the element at the location.
insertAdjacentText	Inserts the given text into the element at the specified location.
isDefaultNamespace	Indicates whether or not a namespace is the default namespace for a document.
isEqualNode	Determines if two nodes are equal.
isSameNode	Determines if two node references refer to the same node.
isSupported	Returns a value indicating whether or not the object supports a specific DOM standard.
lookupNamespaceURI	Gets the URI of the namespace associated with a namespace prefix, if any.
lookupPrefix	Gets the namespace prefix associated with a URI, if any.
msMatchesSelector	Determines whether an object matches the specified selector.
removeAttributeNS	Removes the specified attribute from the object.
setAttributeNodeNS	Sets an attribute object as part of the object.
setAttributeNS	Sets the value of the specified attribute within the specified namespace.

Properties

The optGroup object has these properties.

Property	Description
className	Sets or retrieves the class of the object.
dir	Sets or retrieves the reading order of the object.
disabled	Sets or retrieves a value that indicates whether the user can interact with the object.
id	Sets or retrieves the string identifying the object.
innerHTML	Sets or retrieves the HTML between the start and end tags of the object.
innerText	Sets or retrieves the text between the start and end tags of the object.
isTextEdit	Retrieves whether a TextRange object can be created using the object.
label	Sets or retrieves the label for the option group.
lang	Sets or retrieves the language to use.
language	Sets or retrieves the language in which the current script is written. Note This has been superceded by the type attribute for the script element. If you are using javascript alone, you don't need to specify a type or language with the script element.
localName	Retrieves the local name of the fully qualified XML declaration for a node.
namespaceURI	Retrieves the namespace URI of the fully qualified XML declaration for a node.
offsetHeight	Retrieves the height of the object relative to the layout or coordinate parent, as specified by the offsetParent property.
offsetParent	Retrieves a reference to the container object that defines the offsetTop and offsetLeft properties of the object.
offsetWidth	Retrieves the width of the object relative to the layout or coordinate parent, as specified by the offsetParent property.
outerHTML	Sets or retrieves the object and its content in HTML.
outerText	Sets or retrieves the text of the object.
parentElement	Retrieves the parent object in the object hierarchy.
parentTextEdit	Retrieves the container object in the document hierarchy that can be used to create a TextRange containing the original object.
prefix	Retrieves the local name of the fully qualified XML declaration for a node.
recordNumber	Retrieves the ordinal record from the data set that generated the object.
sourceIndex	Retrieves the ordinal position of the object, in source order, as the object appears in the document's all collection.
style	Sets an inline style for the element.
tagName	Retrieves the tag name of the object.
textContent	Sets or retrieves the text content of an object and any child objects.
title	Sets or retrieves advisory information (a ToolTip) for the object.
uniqueNumber	Retrieves the element's unique number.

Standards information

HTML 4.01 Specification, Section 17.6

Remarks

In HTML 4.01, all optGroup elements must be specified directly within a select element. Groups may not be nested.

You can add optGroup elements only to a select element located in the same window where the optGroup elements are created.

This element is available in HTML as of Microsoft Internet Explorer 6.

Examples

The following example shows how to use the optGroup element to create groups of items in a drop-down list box.

JavaScript


<select>
  <optgroup label="Alkaline Metals">
    <option>Lithium (Li)</option>
    <option>Sodium (Na)</option>
    <option>Potassium (K)</option>
  </optgroup>
  <optgroup label="Halogens">
    <option>Fluorine (F)</option>
    <option>Chlorine (Cl)</option>
    <option>Bromine (Br)</option>
  </optgroup>
</select>