suchen
HeimWeb-FrontendH5-TutorialReguläre Ausdrücke und neue HTML5-Elemente

ProcessOn ist eine Online-Plattform für kollaboratives Zeichnen, die Benutzern die leistungsfähigsten und benutzerfreundlichsten Zeichenwerkzeuge bietet.

Damit können Sie ganz einfach etwas online zeichnen und es im Detail verstehen.

Reguläre Ausdrücke

Beim heutigen regulären Ausdruck geht es nur darum, die einfache Verwendung regulärer Ausdrücke zu erlernen. Angesichts der Leistungsfähigkeit von HTML5-Tag-Attributen müssen wir Javascript nicht mehr lernen, bevor wir reguläre Ausdrücke verwenden, da das Muster von HTML5-Eingabe-Tags eine Tag-Überprüfung realisieren kann, die die komplexe Verwendung von Javascript durch Überprüfungsformulare für reguläre Ausdrücke annähernd ersetzen kann Wird in Zukunft auf jeden Fall komplett ersetzt.

Einfache Verwendung regulärer Ausdrücke:

[0-9] findet jede Zahl von 0 bis 9.
[a-z] findet jedes Zeichen vom Kleinbuchstaben a bis zum Kleinbuchstaben z.
[A-Z] Findet jedes Zeichen von Großbuchstabe A bis Großbuchstabe Z.
[A-z] findet jedes Zeichen vom Großbuchstaben A bis zum Kleinbuchstaben z.
n{X} entspricht einer Zeichenfolge, die X Folgen von n enthält.
n{X,Y} entspricht einer Zeichenfolge, die X- oder Y-Sequenzen von n enthält.
n{X,} entspricht einer Zeichenfolge, die mindestens X Folgen von n enthält.

Denken Sie daran, dass diese einfache reguläre Operationen implementieren können. Zum Beispiel:

<form action="#">
<input type="text" pattern="[0-9a-zA-Z]{1,}" required>
<input type="submit" value="提交">
</form>

Dies ist eine einfache Formularvalidierung mit einem Bereich von mehr als 1 Zeichen von 0 bis 9 oder a bis z oder A bis Z, und es ist erforderlich, diesen Text als Pflichtfeld festzulegen Andernfalls werden Sie beim Absenden zum Ausfüllen des Formulars aufgefordert.

Um reguläre Regeln gezielt zu verwenden, müssen Sie sich die Bedeutung von Metazeichen, Quantoren und eckigen Klammern merken.

Reguläre Ausdrücke und neue HTML5-Elemente

Das Musterattribut gibt die reguläre Übereinstimmungsmethode an und kann nur die Länge schreiben, die dem regulären Muster entspricht.

Es ist derzeit nicht so praktisch wie das RegExp-Objekt von Javascript. Es kann keine Modifikatoren festlegen, d. h. keine globale oder Groß-/Kleinschreibung usw. festlegen.

Aber seine Funktion ist bereits sehr mächtig.

Und warum kann der Modifikator nicht gesetzt werden? Weil es ein regulärer Ausdruck ist und die Erklärung in w3c lautet, dass Muster ein regulärer Ausdruck und keine Zeichenfolge ist. Der Modifikator muss also weggelassen werden Dies ist nicht möglich. Das Setzen dieses Modifikators führt nicht zu einem Fehler.

Zusätzliches Wissen: Passende chinesische reguläre Ausdrücke

[u4e00-u9fa5] Dies stimmt tatsächlich nur mit Chinesisch überein

[^x00-xff ] Dies entspricht allen Nicht-ASCII-Zeichen, bei denen es sich im allgemeinen Sinne um Zeichen halber Breite handelt, und diese %! ) (und dergleichen sind Zeichen in voller Breite.

HTML5-Audio- und Videoelemente

Audio-Audio-Tag

<audio controls autoplay loop >
<source src="URL" type="audio/mp4">
<source ssrc="URL" type="audio/ogg">
<p>你的浏览器不支持</p> 
</audio>

Rendering:

Reguläre Ausdrücke und neue HTML5-Elemente

Seine Attribute:

autoplay autoplay Wenn dieses Attribut vorhanden ist, wird das Audio abgespielt, sobald es bereit ist. Steuerelemente. Wenn vorhanden, Zeigt dem Benutzer Steuerelemente an, z. B. eine Wiedergabeschaltfläche. Wenn vorhanden, wird die Wiedergabe jedes Mal neu gestartet, wenn das Audio endet. 🎜>Preload Preload Wenn dieses Attribut vorhanden ist, wird das Audio geladen, wenn die Seite geladen und für die Wiedergabe vorbereitet wird. autoplay“ verwendet wird, wird dieses Attribut ignoriert.

src url Die URL des abzuspielenden Audios. .

Video-Video-Tag


Seine Attribute:

autoplay autoplay Wenn dieses Attribut erscheint, wird das Video sofort abgespielt, nachdem es fertig ist >Steuerelemente Wenn dieses Attribut angezeigt wird, werden dem Benutzer die Steuerelemente, z. B. die Wiedergabetaste, angezeigt.

<video controls loop muted width="400" height="400" poster="播放前的显示图片URL">
<source src="视频本地地址URL" type="video/mp4">
<source src="视频本地地址URL" type="video/ogg">
<p>你的浏览器不支持</p> 
</video>

Schleife Schleife Wenn dieses Attribut angezeigt wird, beginnt die Wiedergabe erneut, wenn die Mediendatei beendet ist Reguläre Ausdrücke und neue HTML5-Elemente

stummgeschaltet gibt an, dass die Audioausgabe des Videos stummgeschaltet werden soll.

Poster-URL gibt das Bild an, das beim Herunterladen des Videos angezeigt wird Das Bild wird angezeigt, bevor der Benutzer auf die Wiedergabeschaltfläche klickt. Wenn dieses Attribut vorhanden ist, wird das Video geladen, wenn die Seite geladen wird, und ist zur Wiedergabe bereit , dies wird ignoriert. Eigenschaften

src url Die URL des abzuspielenden Videos

Breite des Videos

Sie haben alle drei Formate, eines ist mp4, eines ist ogg und eines ist webm. Die derzeit unterstützten Formate sind nicht perfekt genug Ich hoffe, dass Ihnen die regulären Ausdrücke und neuen Elemente von HTML5 weiterhelfen. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht. Vielen Dank für Ihre Unterstützung zur chinesischen PHP-Website!

Weitere Artikel zu regulären Ausdrücken und neuen HTML5-Elementen finden Sie auf der chinesischen PHP-Website!
Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Dekonstruieren von H5 -Code: Tags, Elemente und AttributeDekonstruieren von H5 -Code: Tags, Elemente und AttributeApr 18, 2025 am 12:06 AM

Der HTML5 -Code besteht aus Tags, Elementen und Attributen: 1. Das Tag definiert den Inhaltstyp und ist von Winkelklammern umgeben, wie z. 2. Elemente bestehen aus Start -Tags, Inhalten und End -Tags wie Inhalten. 3. Attribute definieren Schlüsselwertpaare im Start-Tag und verbessern Funktionen, z. B.. Dies sind die grundlegenden Einheiten zum Aufbau von Webstruktur.

H5 -Code verstehen: Die Grundlagen von HTML5H5 -Code verstehen: Die Grundlagen von HTML5Apr 17, 2025 am 12:08 AM

HTML5 ist eine Schlüsseltechnologie zum Aufbau moderner Webseiten und bietet viele neue Elemente und Funktionen. 1. HTML5 führt semantische Elemente wie usw. ein, die die Webseitenstruktur und die SEO verbessern. 2. Support Multimedia-Elemente und Einbetten von Medien ohne Plug-Ins. 3. Formulare verbessern neue Eingangstypen und Überprüfungseigenschaften und vereinfachen Sie den Überprüfungsprozess. 4. Bieten Sie Offline- und lokale Speicherfunktionen an, um die Leistung der Webseiten und die Benutzererfahrung zu verbessern.

H5 -Code: Best Practices für WebentwicklerH5 -Code: Best Practices für WebentwicklerApr 16, 2025 am 12:14 AM

Zu den Best Practices für den H5 -Code gehören: 1. Verwenden Sie korrekte DocType -Deklarationen und Zeichenkodierung; 2. Verwenden Sie semantische Tags; 3.. HTTP -Anfragen reduzieren; 4. Verwenden Sie asynchrone Laden; 5. Bilder optimieren. Diese Praktiken können die Effizienz, Wartbarkeit und Benutzererfahrung von Webseiten verbessern.

H5: Die Entwicklung von Webstandards und TechnologienH5: Die Entwicklung von Webstandards und TechnologienApr 15, 2025 am 12:12 AM

Webstandards und -technologien haben sich bisher aus HTML4, CSS2 und einfachem JavaScript entwickelt und haben erhebliche Entwicklungen erfahren. 1) HTML5 führt APIs wie Leinwand und Webstorage ein, die die Komplexität und Interaktivität von Webanwendungen verbessern. 2) CSS3 fügt Animations- und Übergangsfunktionen hinzu, um die Seite effektiver zu gestalten. 3) JavaScript verbessert die Entwicklungseffizienz und die Lesbarkeit der Code durch moderne Syntax von Node.js und ES6, wie z. B. Pfeilfunktionen und Klassen. Diese Änderungen haben die Entwicklung von Leistungsoptimierung und Best Practices von Webanwendungen gefördert.

Ist H5 eine Abkürzung für HTML5? Erforschen der DetailsIst H5 eine Abkürzung für HTML5? Erforschen der DetailsApr 14, 2025 am 12:05 AM

H5 ist nicht nur die Abkürzung von HTML5, sondern auch ein breiteres Ökosystem der modernen Webentwicklungstechnologie: 1. H5 enthält HTML5, CSS3, JavaScript und verwandte APIs und Technologien; 2. Es bietet eine reichhaltigere, interaktive und reibungslose Benutzererfahrung und kann nahtlos auf mehreren Geräten ausgeführt werden. 3. Mit dem H5 -Technologie -Stack können Sie reaktionsschnelle Webseiten und komplexe interaktive Funktionen erstellen.

H5 und HTML5: häufig verwendete Begriffe in der WebentwicklungH5 und HTML5: häufig verwendete Begriffe in der WebentwicklungApr 13, 2025 am 12:01 AM

H5 und HTML5 beziehen sich auf dasselbe, nämlich HTML5. HTML5 ist die fünfte Version von HTML, die neue Funktionen wie semantische Tags, Multimedia -Support, Leinwand und Grafiken, Offline -Speicher und lokaler Speicher bietet, die Ausdrucksfähigkeit und Interaktivität von Webseiten verbessert.

Worauf bezieht sich H5? Erforschen des KontextesWorauf bezieht sich H5? Erforschen des KontextesApr 12, 2025 am 12:03 AM

H5REFERSTOHTML5, ApivotaltechnologyInwebdevelopment.1) HTML5IntroducesNewelementsandapisrich, Dynamicwebapplications.2) ITSUPP ortsmultimediaWitHoutPlugins, BETHINGINGUSEREXPERICERCROSSDEVICES.3) SEMANTICELEMENTSIMPROVEPENTENTENTENTRUCTENTRUCTELUREANDSEO.4) H5'SRespo

H5: Tools, Frameworks und Best PracticesH5: Tools, Frameworks und Best PracticesApr 11, 2025 am 12:11 AM

Zu den Tools und Frameworks, die in der H5 -Entwicklung gemeistert werden müssen, gehören Vue.js, React und WebPack. 1.Vue.js eignet sich zum Erstellen von Benutzeroberflächen und unterstützt die Komponentenentwicklung. 2. Die Rendern des Seitenrenders über virtuelle DOM optimiert, geeignet für komplexe Anwendungen. 3.Webpack wird zur Modulverpackung und zur Optimierung der Ressourcenlast verwendet.

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
1 Monate vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
1 Monate vorBy尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. Crossplay haben?
1 Monate vorBy尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

SecLists

SecLists

SecLists ist der ultimative Begleiter für Sicherheitstester. Dabei handelt es sich um eine Sammlung verschiedener Arten von Listen, die häufig bei Sicherheitsbewertungen verwendet werden, an einem Ort. SecLists trägt dazu bei, Sicherheitstests effizienter und produktiver zu gestalten, indem es bequem alle Listen bereitstellt, die ein Sicherheitstester benötigen könnte. Zu den Listentypen gehören Benutzernamen, Passwörter, URLs, Fuzzing-Payloads, Muster für vertrauliche Daten, Web-Shells und mehr. Der Tester kann dieses Repository einfach auf einen neuen Testcomputer übertragen und hat dann Zugriff auf alle Arten von Listen, die er benötigt.

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Leistungsstarke integrierte PHP-Entwicklungsumgebung