conjunto de opciones de Datalist

Objeto Datalist del DOM HTML

definición y uso

opciones La colección devuelve Elemento <datalist> de todos los elementos de la lista.

Comentarios:Los elementos de la colección se ordenan según su aparición en el código fuente.

Véase también:

Manual de referencia HTML:Etiqueta <datalist> de HTML

Manual de referencia HTML:Etiqueta <option> de HTML

Ejemplo

Ejemplo 1

Encontrar cuántos elementos se especifican en el elemento <datalist> designado:

var x = document.getElementById("browsers").options.length;

Prueba personalmente

El resultado de x será:

5

Consejo:Más ejemplos se proporcionan en la parte inferior de la página.

Sintaxis

datalistObject.options

Atributo

Atributo Descripción
longitud

Devuelve la cantidad de elementos <option> en la colección.

Comentarios:Esta propiedad es de solo lectura.

Método

Método Descripción
[índice]

Devuelve el elemento <option> con el índice especificado (comienza en 0) de la colección.

Comentarios:Si el número de índice está fuera de rango, devuelve null.
item(índice)

Devuelve el elemento <option> con el índice especificado (comienza en 0) de la colección.

Comentarios:Si el número de índice está fuera de rango, devuelve null.
namedItem(id)

con especificación id se devuelve el elemento <option> de la colección.

Comentarios:Si id Si no existe, devuelve null.

Detalles técnicos

Versión DOM: Nivel 2 Document Object
Valor devuelto:

Objeto HTMLCollection, que representa todos los Elemento <option>.

Los elementos de la colección se ordenan según su aparición en el código fuente.

Soporte de navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte 10.0 Soporte Soporte Soporte

Más ejemplos

Ejemplo 2: [índice]

Obtener el valor del primer elemento de la lista de datos (índice 0):

var x = document.getElementById("browsers").options[0].value;

Prueba personalmente

El resultado de x será:

Internet Explorer

Ejemplo 3: item(índice)

Obtener el valor del primer elemento de la lista de datos (índice 0):

var x = document.getElementById("browsers").options.item(0).value;

Prueba personalmente

El resultado de x será:

Internet Explorer

Ejemplo 4: namedItem(name_or_id)

Obtener el valor del elemento con id="google" en la lista de datos:

var x = document.getElementById("browsers").options.namedItem("google").value;

Prueba personalmente

El resultado de x será:

Chrome

Ejemplo 5

Recorrer todos los elementos de la lista de datos y mostrar los valores de los elementos:

var x = document.getElementById("mySelect");
var txt = "";
var i;
for (i = 0; i < x.options.length; i++) {
  txt = txt + x.options[i].value + "<br>";
}

Prueba personalmente

El resultado de txt será:

Internet Explorer
Firefox
Chrome
Opera
Safari

Objeto Datalist del DOM HTML