Que signifie la balise html optgroup ? Concernant l'analyse de l'utilisation et des instances d'attribut de la balise html optgroup, cet article présente les exemples de définition et d'attribut de la balise html optgroup, ainsi que l'utilisation de la balise html optgroup
balise html optgroup Définition et utilisation : la balise
L'élément optgroup est utilisé pour regrouper les options. Lorsque vous travaillez avec une longue liste d’options, le regroupement des options associées peut faciliter les choses.
Exemple de balise HTML
Regroupez les options associées via la balise
<select>
<optgroup label="Swedish Cars">
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value ="mercedes">Mercedes</option>
<option value ="audi">Audi</option>
</optgroup>
</select>Attributs obligatoires de l'étiquette html optgroup :
étiquette : texte : Spécifie une description pour le groupe d'options. (Exemple ci-dessus)
Attributs facultatifs de la balise html optgroup :
disabled : désactivé : Spécifie que le groupe d'options est désactivé. L'attribut désactivé de la balise HTML
Vous pouvez définir l'attribut désactivé pour restaurer l'utilisation du groupe d'options par l'utilisateur jusqu'à ce que certaines conditions soient remplies (telles que la sélection d'une case à cocher). Vous pouvez ensuite utiliser JavaScript pour effacer l'attribut désactivé afin que le groupe d'options devienne disponible.
Instance d'attribut désactivé de la balise optgroupUn groupe d'options désactivé :
Utilisation de la balise optgroup en HTML, regroupée, en lecture seule et affichée sous forme d'arborescence :
En plus de la balise option dans la balise select du HTML, il existe une autre balise appelée optgroup. Qu’est-ce que cela peut nous apporter ?
Nous avons déjà compris la signification des points de connexion à partir du nom : c'est un groupe d'options, tout comme checkboxgroup et radiogurop, il est utilisé pour le regroupement
<select>
<optgroup label="German Cars" disabled="disabled">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select> <> et le style du style est différent de la balise Option, et les polices sont épaisses. Et le menu déroulant s'affiche dans un style arborescent.
Tous les principaux navigateurs prennent en charge la balise
Attributs globaux<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>optgroup</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
<select>
<optgroup label="Java">
<option value="jsp Servlet">jsp Servlet</option>
<option value="javaEE">javaEE</option>
</optgroup>
<optgroup label=".Net">
<option value="aspx">aspx</option>
<option value="C#">C#</option>
</optgroup>
</select>
</body>
</html>
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
