Zusammenfassung neuer Elemente und Tags in HTML5

Ich bin immer auf schriftliche Testfragen zu neuen h5-Tags gestoßen, daher habe ich die Informationen überprüft, um sie zusammenzufassen:

1. Formularbezogen:

(1) Formularattribut: Formularelement in HTML5 kann außerhalb des Formulars platziert werden und zeigt auf das Zielformular, indem das Formularattribut zum Element hinzugefügt wird (der Formularattributwert wird auf die Zielformular-ID gesetzt).

(2) Formaction-Attribut: HTML5 fügt das Formaction-Attribut zu Übermittlungsschaltflächen (z. B. Schaltfläche, Senden, Bild usw.) hinzu, um die Übermittlung an verschiedene Serveradressen zu erleichtern.

<input formaction="new.html" type="submit" value="提交到new.html">

(3) formmethod-Attribut: Die Verwendung ist die gleiche wie bei formaction.

(4) Platzhalterattribut: eine Textaufforderung, die verwendet wird, wenn sich das Textfeld in einem nicht eingegebenen Zustand befindet.

(5) Autofokus-Attribut: Erhält automatisch den Fokus. Nur ein Steuerelement auf einer Seite kann dieses Attribut haben. Dieses Attribut hat keinen Wert, schreiben Sie es einfach direkt.

<input name="username" autofocus type="text" id="username">

(6) Listenattribut: Wird für einzeilige Textfelder verwendet. Der Wert dieses Attributs ist die ID eines bestimmten Datenlistenelements. Das einzeilige Textfeld ähnelt nach dem Hinzufügen ein Auswahlfeld (select), aber es ist eine benutzerdefinierte Eingabe zulässig. Um Fehler in Browsern zu vermeiden, die dieses Element nicht unterstützen, verwenden wir normalerweise CSS-Einstellungen, um es nicht anzuzeigen.

order:<input list="list" name="order" autofocus type="text" id="order">
            <datalist id="list" style="display:none">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            </datalist>

(7) Autocomplete-Attribut: Autocomplete ermöglicht es dem Browser, die Eingabe in das Feld vorherzusagen. HTML5 implementiert eine benutzerdefinierte Einstellung dieses Attributs und vermeidet so die Sicherheitsrisiken, die jeder sehen kann. Dieses Attribut hat drei Werte: „on“, „off“ oder „“ (nicht angegeben), wird der Standardwert des Browsers verwendet.

(8) Eingabeelementtyp:

Suche: ähnlich wie Textfeld, wird für die Suche verwendet;

Tel: ähnlich wie Textfeld, wird für Telefonanrufe verwendet;

URL: ähnlich dem Textfeld, wird für Adressen im URL-Format verwendet;

E-Mail: ähnlich dem Textfeld, wird für Adressen im E-Mail-Format verwendet; Textfeld ist ähnlich und wird für numerische Werte verwendet;

Bereich: Ermöglicht nur die Eingabe von Werten innerhalb eines Bereichs, und der Bereich wird durch die Min- und Max-Attribute festgelegt Farbe: Farbtextfeld, „#000000“ Text im Format „Textfeld für Zeiteingabe“; >

Automatische Überprüfung (d. h. durch Hinzufügen entsprechender Attribute zum Element, um die Überprüfungsanforderungen zu erfüllen)

erforderliches Attribut: Elemente mit diesem Attribut dürfen nicht übermittelt werden, wenn ihr Inhalt leer ist, und a entsprechende Aufforderung erfolgt.

Musterattribut: Wenn der Inhalt bei Elementen mit diesem Attribut nicht leer ist, wird der Inhalt mit dem Musterwert abgeglichen. Wenn der Abgleich nicht erfolgreich ist, wird er nicht bestanden und eine Eingabeaufforderung angezeigt.

Min-Attribut und Max-Attribut: Hierbei handelt es sich um spezielle Attribute für Eingabeelemente vom Werttyp und Datumstyp, die den Eingabebereich einschränken.

Schrittattribut: Steuert den Schritt, in dem sich der Wert eines Elements erhöht oder verringert. Wenn Sie beispielsweise eine Zahl zwischen 1 und 100 eingeben und der Schritt 5 ist, können Sie nur 1, 6, 11 eingeben ....

Anzeigeüberprüfung (zusätzlich zum Hinzufügen von Attributen zu Elementen zur automatischen Überprüfung verfügen Formularelemente und Eingabeelemente (Eingabe), einschließlich Auswahlelemente und Textbereich, in HTML5 über eine checkValidity-Methode, die durch Aufrufen dieser Methode manuell überprüft werden kann . Die checkValidity-Methode gibt das Überprüfungsergebnis in Form eines booleschen Werts zurück)

Validierung abbrechen (Formularvalidierung abbrechen hat zwei Attribute: novalidate für Formular und formnovalidate für Senden)

Benutzerdefinierte Fehler: In HTML5 verfügen Formularbrowser, die nicht überprüft wurden, über Standardaufforderungen, sie stellen jedoch auch benutzerdefinierte Fehleraufforderungen über JavaScript bereit. (Ich glaube, ich muss einfach selbst eine Funktion schreiben und sie aufrufen, wenn ich klicke).

2. Erweiterte Seitenelemente

(1) Abbildungselement: Abbildung ist ein Kombinationselement, das einen Abbildungstitel tragen kann.

(2) Details-Element: Details bietet eine Alternative zu Javascript, um lokale Bereiche auf dem Bildschirm zu erweitern oder zu verkleinern.

function check(){
        var email=document.getElementById("email");
        if(email.checkValidity()){
        alert("email格式正确");
        }else{
        alert("email格式不正确");
        }
        }

(3) Mark-Element: Mark-Element gibt an Teil der Seite, der hervorgehoben oder hervorgehoben werden muss.

//用于form的novalidate
        <form novalidate>
        <input type="text" name="name" id="name" required>
        <input type="submit" name="button" id="button" value="提交">
        </form>

        //用于submit的formnovalidate
        <form>
        <input type="text" name="name" id="name" required>
        <input type="submit" orfmnovalidate name="button" id="button" value="提交">
        </form>

(4) Fortschrittselement: Wird im Allgemeinen zum Schreiben von Fortschrittsbalken verwendet. Sie können die Attribute value und max für den Fortschritt festlegen, und max stellt die Gesamtzahl dar gültige Gleitkommazahlen sein. Wert muss größer als 0 und kleiner oder gleich max sein. Wenn Sie diese beiden Attribute nicht für den Fortschritt festlegen, wird die dynamische Anzeige ausgeführt und der Fortschritt ist ungewiss.

(5) Meterelement: Definiert Gewichte und Maße. (Die oberen und unteren Werte werden farblich unterschieden.)

　　　high:定义度量的值位于哪个点，被界定为高的值。
low:定义度量的值位于哪个点，被界定为低的值。
max:定义最大值。默认值是 1。
min:定义最小值。默认值是 0。
optimum:定义什么样的度量值是最佳的值,如果该值高于 "high" 属性，则意味着值越高越好。如果该值低于 "low" 属性的值，则意味着值越低越好。
value:定义度量的值。

（6）改良的ol列表：在HTML5中为ol元素添加了start属性和reversed属性。

　　start：表示列表序号从几开始。

　　reversed：表示列表序号为倒序。

（7） 改良的dl列表：dl是专门用来定义术语的列表，在HTML5中为dt增加了名字dfn。

        <dl>
        <dt>术语1</dt>
        <dd>描述...</dd>
        <dt><dfn>名字</dfn>术语2</dt>
        <dd>描述...</dd>
        </dl>

(8)cite:用于表示作者。

(9)small:用于标识“小型文本”。

(10)

标签:定义外部的内容。

(11)

标签:定义 article 以外的内容。aside 的内容应该与 article 的内容相关。aside可以用于网站页尾一排排的广告或者链接，一竖排为一个aside。也可以用于博客侧栏。

（12）

（13） 标签：定义图形（是为了客户端矢量图形而设计的）。

（14） 标签：定义命令按钮，比如单选按钮、复选框或按钮。

（15） 标签:定义嵌入的内容，比如插件。

（16）

 标签：定义 section 或 document 的页脚。

（17）

 标签：定义 section 或 document 的页眉。
（18）

 标签：用于对网页或区段（section）的标题进行组合。

（19）

 标签：用于对网页或区段（section）的标题进行组合。

（20）

 标签：定义导航链接的部分。

（21）

 标签：定义不同类型的输出，比如脚本的输出。

（22） 标签：在 ruby 注释中使用，以定义不支持 ruby 元素的浏览器所显示的内容。

（23） 标签：定义字符（中文注音或字符）的解释或发音。

（24） 标签：定义 ruby 注释（中文注音或字符）。

（25）

 标签：定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分。
（26） 标签：为媒介元素（比如

（27）

 标签：details 元素的标题，”details” 元素用于描述有关文档或文档片段的详细信息。”summary” 元素应该是 “details” 元素的第一个子元素。

（28） 标签：定义日期或时间，或者两者。

（29）

 (30) 

标签：定义对话（会话）dialog元素表示几个人之间的对话。