Quels sont les attributs de la balise HTML5 ? Utilisation spécifique de la balise HTML5 (avec exemples)

Quels sont les attributs de la balise

HTML5

La définition et l'utilisation de la balise HTML5

La datalist et ses options ne seront pas affichées, c'est juste une liste de valeurs d'entrée légales.

Veuillez utiliser l'attribut list de l'élément d'entrée pour lier la liste de données.

Attributs et descriptions des balises HTML5

AlternatingItemStyle obtient les propriétés de style des éléments alternés dans le contrôle DataList.

AlternatingItemTemplate obtient ou définit le modèle de l'élément alterné dans la DataList. Attributes obtient toutes les valeurs d'attribut du contrôle Web.

BackColor obtient ou définit la couleur d'arrière-plan du contrôle du serveur Web. .

BorderColor obtient ou définit la couleur de la bordure du contrôle Web.

BorderStyle obtient ou définit le style de bordure du contrôle serveur Web.

BorderWidth obtient ou définit la largeur de la bordure du contrôle du serveur Web.

CellPadding obtient ou définit la quantité d'espace entre le contenu de la cellule et la bordure de la cellule.

CellSpacing obtient ou définit la quantité d'espace entre les cellules.

Une collection de contrôles enfants dans le contrôle de liste Controls

DataKeyField Obtient ou définit le champ clé dans la source de données spécifiée par la propriété DataSource.

DataKeys stocke la valeur clé de chaque enregistrement dans le contrôle de liste de données (affichée sous forme de ligne).

DataMember obtient ou définit le membre de données spécifique dans la source de données multi-membres à lier au contrôle de liste de données.

DataSource Obtient ou définit la source qui contient la liste de valeurs utilisées pour remplir les éléments du contrôle.

EditItemIndex obtient ou définit le numéro d'index de l'élément sélectionné à modifier dans le contrôle DataList.

EditItemStyle Obtient les propriétés de style de l'élément sélectionné pour la modification dans un contrôle DataList.

EditItemTemplate Obtient ou définit le modèle de l'élément sélectionné pour modification dans le contrôle DataList.

Enable obtient ou définit une valeur indiquant si le contrôle du serveur Web est activé.

HeaderTemplate obtient ou définit le modèle pour la partie en-tête du contrôle DataList.

La hauteur obtient ou définit

Exemple de balise HTML

Ce qui suit est un élément d'entrée, ses valeurs possibles sont décrites dans datalist :

<input id="myCar" list="cars" />
<datalist id="cars">
  <option value="BMW">
  <option value="Ford">
  <option value="Volvo">
</datalist>

J'ai trouvé deux utilisations spécifiques de la balise HTML5

J'ai besoin d'un e-mail achèvement lorsque je travaille sur quelque chose récemment, donc je suis entré en contact avec datalist , je pense que c'est très utile. Datalist doit être utilisé conjointement avec la balise d'entrée et peut être utilisé pour les recommandations d'entrée, la complétion des e-mails, etc. L’utilisation pertinente sera brièvement enregistrée ci-dessous.

1.La balise HTML5

<p>请输入您最喜欢的科目：</p>
<input type="text" list="mylist1">
<datalist id="mylist1">
<option value="电路原理">
<option value="数字电路">
<option value="模拟电路">
<option value="计算机原理">
</datalist>
</br>

L'identifiant de datalist doit être cohérent avec l'attribut de liste When. préparation à la sortie, saisie L'option option apparaîtra automatiquement ci-dessous. La liste de données a la fonction de requête floue. Par exemple, si vous entrez « route » dans la zone de texte, le contenu recommandé est les principes des circuits, les circuits numériques et les circuits analogiques.

2. La balise HTML5

code html :

<p>请输入您的邮箱：</p>
<input id="emailInput" oninput="suggestEmail()" type="text" list="mylist2">
<datalist id="mylist2"></datalist>

code js :

function suggestEmail(){
var email = $("#emailInput").val();
$("#mylist2").empty();
if(email.indexOf("@")>-1){
return false;
}else{
$("#mylist2").append("<option value=&#39;"+ email +"@qq.com&#39;>"+
"<option value=&#39;"+ email +"@126.com&#39;>"+
"<option value=&#39;"+ email +"@foxmail.com&#39;>"+
"<option value=&#39;"+ email +"@163.com&#39;>"+
"<option value=&#39;"+ email +"@gmail.com&#39;>")
}
}

L'attribut oninput de la balise input peut détecter les changements dans le contenu d'entrée Lorsque le contenu de la zone de saisie change, js est lancé pour ajouter l'option dans la liste de données. Si l'utilisateur saisit @ manuellement, aucune invite n'est nécessaire.

Différences entre HTML 4.01 et HTML 5 : La balise

Prise en charge des navigateurs :

Tous les principaux navigateurs prennent en charge la balise

[Recommandations associées]

Quels sont les nouveaux éléments structurels en HTML5 ? Utilisation de nouveaux éléments structurels en HTML5 (recommandé)

Qu'est-ce que la balise article en HTML5 ? Où l’élément article est-il utilisé en HTML5 ?

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!