HTML-kenmerken

HTML-attributen kunnen worden gezegd als speciale woorden die worden gebruikt in openingstags en die verantwoordelijk zijn voor het beheersen van het gedrag van een element. Ze zijn een modifier van het HTML-elementtype. Deze modifier kan twee taken uitvoeren. Het kan de standaardfunctionaliteit van een element wijzigen of het kan de functionaliteit bieden aan elk element dat zonder deze niet goed kan functioneren. Syntactisch wordt een kenmerk toegevoegd aan de HTML-starttag. Er zijn verschillende typen attributen geïdentificeerd. Deze omvatten de vereiste kenmerken, optionele kenmerken, standaardkenmerken en gebeurteniskenmerken. Vereiste attributen zijn eigenschappen die nodig zijn voor een bepaald elementtype zodat de functie correct werkt. Het optionele kenmerk kan worden gebruikt om de standaardfunctionaliteit van een elementtype te wijzigen. De standaardattributen worden ondersteund door een groot aantal elementtypen en gebeurtenisattributen kunnen worden gebruikt om elementtypen te veroorzaken die de scripts kunnen specificeren die onder specifieke omstandigheden worden uitgevoerd. De attributen verschijnen meestal als naam-waarde paren en worden gescheiden door '=' (gelijkteken). Ze worden geschreven in de start-tag van een element achter de naam van het element.

Verschillende HTML-kenmerken

Laten we eens kijken naar verschillende HTML-kenmerken en hoe ze in detail werken.

Kernattributen

Er zijn vier kernattributen die veel worden gebruikt. Om deze te noemen zijn ze als volgt:

  • ID: dit kenmerk van HTML kan eenvoudig worden gebruikt om op unieke wijze een element te identificeren dat aanwezig is op een HTML-pagina. Het gebruikers-ID kan worden gebruikt wanneer een element een id-kenmerk als een unieke identificatie draagt, waardoor het element en de inhoud ervan kunnen worden geïdentificeerd of dit wordt gebruikt wanneer er twee elementen met dezelfde naam op een webpagina zijn. Het ID-kenmerk kan helpen bij het gemakkelijk identificeren van het verschil tussen de elementen met dezelfde naam.
  • Het titelkenmerk: met dit kenmerk wordt een voorgestelde titel voor een bepaald element gegeven. Het hangt af van de drager hoe het zich zal gedragen en hoewel het meestal niet wordt weergegeven als een tooltip wanneer de cursor over het element komt of of het moet worden weergegeven wanneer het element wordt geladen. Het wordt ook gebruikt om een ​​element uit te leggen over het er met de muis overheen bewegen. Het gedrag kan verschillen met verschillende elementen en in het algemeen wordt de waarde ervan weergegeven bij het laden of wanneer de muisaanwijzer eroverheen wordt bewogen.
  • Het klasseattribuut: de associatie van dit attribuut gebeurt met een element van het stijlblad. De gebruiker moet de klasse van het element opgeven. Over dit kenmerk kan meer worden geleerd wanneer Cascading Style-blad wordt geleerd. De waarde hier kan ook een door spaties gescheiden lijst met klassenamen zijn. Bijvoorbeeld: class = "className1 className2 className3"
  • Het stijlkenmerk: met dit kenmerk kunt u de Cascading Style Sheet-regels binnen elk element opgeven. Het kan verschillende Cascading Style-bladeffecten bieden aan de HTML-elementen, zoals het vergroten van de lettergrootte. Het kan ook de lettertypefamilie en kleur wijzigen.

Na de kernkenmerken hebben we enkele kenmerken voor internationalisering. Ze zijn zoals hieronder:

Internationaliseringskenmerk

  • Dir: Het dir-attribuut helpt u om de browser de richting aan te geven waarin een tekst moet volgen. Dit kenmerk kan meestal twee waarden aannemen. Dit kunnen LTR en RTL zijn. LTR betekent van links naar rechts en dit is de standaardwaarde, terwijl RTL staat voor rechts naar links. Wanneer dit kenmerk in de tag wordt gebruikt, bepaalt dit hoe een tekst in het hele document moet worden weergegeven. Het kan ook worden gebruikt om de richting van de tekst te regelen op basis van alleen de inhoud van de tag.
  • Het kenmerk Lang: Dit kenmerk helpt bij het presenteren van de hoofdtaal die in een document wordt gebruikt. Dit kenmerk kan in HTML worden bewaard, zodat het achterwaarts compatibel is met eerdere versies van HTML. Het kan ook worden vervangen door XML: lang-kenmerk in nieuwe XHTML-documenten. De waarden van lang attributen zijn ISO-639-standaard en hebben taalcodes van twee tekens. Een taal declareren is belangrijk om toegang te krijgen tot de applicatie en verschillende zoekmachines.
  • Het XML-Lang- kenmerk : dit kenmerk wordt verondersteld de vervanging te zijn van het lang-kenmerk. De waarde van het kenmerk XML-lang moet de landcode hebben zoals eerder vermeld.

Naast deze zijn er veel generieke kenmerken die hieronder worden beschreven.

Generiek kenmerk

  • Align Attribute: Dit attribuut is handig wanneer u bepaalde elementen van uw pagina tot uw beschikking wilt hebben. U kunt de uitlijning wijzigen naar links, rechts of het midden van de pagina. De standaarduitlijning voor alle elementen is ingesteld op links. Dit kan worden gewijzigd met behulp van dit kenmerk align.
  • Src-kenmerk: als een gebruiker een afbeelding in een webpagina moet invoegen, moeten we de tag met het src-kenmerk. We kunnen het adres van de afbeelding opgeven als de waarde van het kenmerk in het dubbele citaat. U kunt het src-kenmerk gebruiken zoals hieronder om de afbeelding op de webpagina op te nemen.


src Attribute


  • Alt- kenmerk : dit kenmerk wordt gebruikt als een alternatieve tag die kan worden gebruikt om iets weer te geven als het primaire kenmerk dat de tag die niet de oorspronkelijke waarde weergeeft die eraan is toegewezen. Dit kan de afbeelding beschrijven aan een ontwikkelaar die deze aan het coderingseinde gebruikt. Als de hoofdafbeelding mislukt, kan de alternatieve afbeelding worden gebruikt om weer te geven.
  • Het attribuut Breedte en Hoogte: dit attribuut kan worden gebruikt om de hoogte en breedte van een afbeelding aan te passen.

Example:

Width and Height


<

  • Het Href- kenmerk : dit kenmerk wordt gebruikt wanneer de gebruiker naar een specifieke link naar een willekeurig adres wil gaan. Dit kenmerk wordt samen met de tag gebruikt. Wanneer de link in het href-kenmerk wordt geplaatst waar deze naartoe moet worden geleid, wordt deze gekoppeld aan de tekst die in de tag wordt weergegeven. Wanneer de gebruiker op deze tekst klikt, wordt de gebruiker omgeleid naar het adres van de link. De standaardoptie om deze pagina op hetzelfde tabblad te openen. Als u het doelkenmerk gebruikt, kunt u de waarde instellen op _blank. Hiermee wordt u omgeleid naar een ander tabblad of een ander venster op basis van de configuratie van uw browser.

Gegevenskenmerk

HTML biedt ook aangepaste gegevenskenmerken die u helpen informatie met betrekking tot u toe te voegen in HTML-tags. Deze zijn niet specifiek voor HTML5 en kunnen op alle HTML-elementen worden gebruikt. Het data - * attribuut helpt ons bij het aanpassen van onze eigen aangepaste data-attributen, het kan de gegevens privé opslaan op de pagina of de applicatie.

Om aan te passen, zijn de gegevens verdeeld in twee delen:

  1. Kenmerknaam: deze moet minimaal één teken lang zijn en mag geen hoofdletters bevatten. Deze naam kan ook worden voorafgegaan door 'data-' te gebruiken.
  2. Attribuutwaarde: de waarde voor een attribuut kan elke tekenreeks zijn.

De syntaxis voor gegevenskenmerk is als:

  • Gitanjali

    • DOM-kenmerkeigenschap

    Om de NamedNodeMap-objecten te verkrijgen, moeten de kenmerkeigenschappen in HTML DOM worden gebruikt. Het retourneert de groep knooppuntattributen. De NamedNodeMap vertegenwoordigt ook de verzameling attribuutobjecten en is toegankelijk via indexnummer. Dit indexnummer begint bij 0.

    De syntaxis om dit te gebruiken is: node.attributes

    De waarde die wordt geretourneerd, zijn de NamedNodeMap-objecten die aanwezig zijn in de verzameling knooppunten. Als de gebruiker Internet Explorer 8 of een van de eerdere versies gebruikt, retourneert de eigenschap attributes alle mogelijke attributen voor elk element en dit kan resulteren in meer waarden dan verwacht.

    Example:


    HTML DOM attributes Property


    HTML DOM attributes Property

    Click Here!


    Button element attributes:

    function myeduCBA() (
    // It returns the number of nodes
    var cba = document.getElementById("CBA").attributes.length;
    // Display the number of nodes
    document.getElementById("sudo").innerHTML = cba;
    )

    The output for above program will be
    Button element attributes: 2

    Example:


    HTML DOM attributes Property


    HTML DOM attributes Property

    Click Here!


    Button element attributes:

    function myeduCBA() (
    // It returns the number of nodes
    var cba = document.getElementById("CBA").attributes.length;
    // Display the number of nodes
    document.getElementById("sudo").innerHTML = cba;
    )

    The output for above program will be
    Button element attributes: 2

    Example:


    HTML DOM attributes Property


    HTML DOM attributes Property

    Click Here!


    Button element attributes:

    function myeduCBA() (
    // It returns the number of nodes
    var cba = document.getElementById("CBA").attributes.length;
    // Display the number of nodes
    document.getElementById("sudo").innerHTML = cba;
    )

    The output for above program will be
    Button element attributes: 2

    Globale attributen

    HTML biedt ook globale kenmerken die met elk HTML-element kunnen worden gebruikt. De attributen zijn zoals hieronder.

    • Toegangstoets: hiermee geeft u een sneltoets op om elk element te activeren of erop te focussen.
    • Vertalen: als dit kenmerk wordt gebruikt, geeft het aan of de inhoud van het element moet worden vertaald of niet.
    • Klasse: het specificeert een of meer klassennamen voor een element.
    • Titel: dit kenmerk geeft extra informatie over een element aan.
    • Contenteditable: om aan te geven of de inhoud bewerkbaar is of niet, dit kenmerk kan worden gebruikt.
    • Tabindex: geeft de tabvolgorde van een element aan.
    • Dir: het specificeert de tekstrichting voor elke inhoud van een element.
    • Spellingcontrole: de gebruiker kan expliciet opgeven of hij de spelling en grammatica moet controleren of niet.
    • Versleepbaar: het geeft aan of een element versleepbaar moet zijn of niet.
    • Dropzone: het geeft aan of de gesleepte gegevens worden gekopieerd, verplaatst of gekoppeld wanneer ze worden neergezet.

    Evenementattributen

    HTML heeft de mogelijkheid om acties te activeren wanneer sommige evenementen plaatsvinden. De attributen van de gebeurtenis kunnen zijn zoals hieronder.

    Onload: het wordt geactiveerd nadat de pagina is geladen.

    Onmessage: dit kan worden gezegd als een script dat wordt uitgevoerd wanneer het bericht wordt geactiveerd.

    Opslag: dit is een script dat moet worden uitgevoerd wanneer een webopslaggebied wordt bijgewerkt.

    Onerror: dit script wordt uitgevoerd wanneer er een fout optreedt.

    Onpagehide: dit script kan worden gebruikt wanneer een gebruiker weg van een pagina kan navigeren.

    Formulier Attributen

    Deze gebeurtenissen worden geactiveerd door acties in een HTML-formulier.

    Onblur: het wordt geactiveerd zodra het element de focus verliest.

    Onchange: het wordt geactiveerd zodra de waarde van een element verandert.

    Oncontextmenu: dit wordt uitgevoerd wanneer een contextmenu wordt geactiveerd.

    Onfocus: het wordt geactiveerd zodra het element focus krijgt.

    Oninput: het script moet worden uitgevoerd wanneer het element een invoer ontvangt.

    Onsearch: dit wordt geactiveerd wanneer de gebruiker iets in het zoekveld schrijft.

    Oninvalid: dit wordt geactiveerd wanneer een ingevoerd element ongeldig is.

    Belangrijkste kenmerken van gebeurtenissen

    Onkeydown: het wordt geactiveerd wanneer een toets wordt ingedrukt.

    onkeypress: dit wordt geactiveerd wanneer een toets wordt ingedrukt.

    Onkeyup: dit wordt geactiveerd wanneer een gebruiker een sleutel loslaat.

    Kenmerken muisgebeurtenis

    Onclick: dit wordt geactiveerd wanneer de muis op een element klikt.

    Onmousemove: dit wordt geactiveerd wanneer de muisaanwijzer beweegt terwijl deze zich boven een element bevindt.

    Onmouseip: het wordt geactiveerd wanneer een muisknop van een element wordt losgelaten.

    Onwheel: het wordt geactiveerd wanneer het muiswiel over een element omhoog of omlaag rolt

    Sleep gebeurtenisattributen

    Ondrag: dit wordt geactiveerd wanneer een element wordt gesleept.

    Ondragleave: het script wordt uitgevoerd wanneer een element een geldig drop-doel verlaat.

    Ondrop: het wordt geactiveerd wanneer het gesleepte element valt

    Onscroll: het script wordt uitgevoerd wanneer de schuifbalk van een element wordt gescrolld.

    Conclusie - HTML-kenmerken

    HTML is de oudste technologie die wordt gebruikt om verschillende webapplicaties te maken. HTML is in de loop van de tijd geleidelijk geëvolueerd en biedt veel functies voor de aanwezige elementen. Het biedt een breed scala aan attributen die helpen bij het effectiever maken van de applicatie. Deze omvatten kernattributen, de basisattributen die het meest worden gebruikt. Het biedt ook kenmerken voor internationalisering waarmee talen kunnen worden gewijzigd. Het data-attribuut helpt bij het opslaan en aanpassen van de gegevens zoals de gebruiker wil. Met al deze heeft het ook globale attributen die met elk element en overal kunnen worden gebruikt. Het heeft ook gebeurtenisattributen die worden geactiveerd wanneer enige vorm van gebeurtenis plaatsvindt. Als gevolg hiervan maakt het de webtoepassing of webpagina zeer interactief. HTML blijkt dus nog steeds in het spel te zijn van de ontwikkeling van webapplicaties vanwege al deze functies. Hiermee maakt het stijlkenmerk dat kan worden gebruikt met CSS het mooier en aantrekkelijker om te gebruiken. Maak dus gebruik van alle aanwezige attributen en beschik op de gemakkelijke manier over een geweldige webapplicatie naar keuze.

    Aanbevolen artikelen

    Dit is een handleiding voor HTML-kenmerken geweest. Hier hebben we de concepten en verschillende attributen van HTML besproken. U kunt ook de volgende artikelen bekijken voor meer informatie -

    1. Wat is HTML in eenvoudige bewoordingen?
    2. Leer hoe HTML werkt
    3. Wat is XML?
    4. Top HTML-lijststijlen
    5. Vergelijkingen van HTML versus XML

    Categorie:

    Web ontwikkelingstools