HTML-attributter

HTML-attributter kan sies som spesielle ord som brukes i åpningskoder og er ansvarlige for å kontrollere elementets oppførsel. De er en modifiserer av HTML-elementtype. Denne modifisereren kan gjøre to jobber. Den kan enten endre standardfunksjonaliteten til et element, eller den kan gi funksjonaliteten til ethvert element som ikke er i stand til å fungere ordentlig uten dem. Syntaktisk legges et attributt til HTML-starttaggen. Det er forskjellige typer attributter som er identifisert. Disse inkluderer nødvendige attributter, valgfrie attributter, standardattributter og hendelsesattributter. Nødvendige attributter er de som trengs av en bestemt elementtype, slik at funksjonen fungerer riktig. Valgfritt attributt kan brukes til å endre standardfunksjonaliteten til en elementtype. Standardattributtene støttes av et stort antall elementtyper, og hendelsesattributter kan brukes til å forårsake elementtyper som kan spesifisere skript som kjøres under spesifikke omstendigheter. Attributtene vises vanligvis som navn-verdi-par og skilles med '=' (likhetstegn). De skrives innen startkoden til et element etter elementets navn.

Ulike HTML-attributter

La oss se på forskjellige HTML-attributter og hvordan de fungerer i detalj.

Kjerneattributter

Det er fire kjerneattributter som i hovedsak brukes. For å nevne disse er de som følger:

  • ID: Dette attributtet til HTML kan enkelt brukes til å identifisere et element som er til stede på en HTML-side på en unik måte. Bruker-ID kan brukes enten når et element har en ID-attributt som en unik identifikator, noe som gjør det mulig å identifisere elementet og innholdet, eller dette blir brukt når det er to elementer som har samme navn på en webside. ID-attributtet kan hjelpe til med å identifisere forskjellen mellom elementene som har samme navn.
  • Tittelattributtet: Dette attributtet gjør arbeidet med å gi en foreslått tittel for et bestemt element. Det avhenger av transportøren hvordan det vil oppføre seg, og selv om det vanligvis ikke vises som en verktøytips når markøren kommer over elementet, eller om den må vise det når elementet lastes inn. Det brukes også til å forklare et element ved å sveve musen over den. Oppførselen kan variere med forskjellige elementer, og generelt vises verdien ved lasting eller ved å sveve musepekeren over den.
  • Klasseattributtet: Tilknytningen til dette attributtet gjøres med et element i stilarket. Brukeren må spesifisere klassen til elementet. Mer kan læres om dette attributtet når ark for Cascading Style læres. Verdien her kan også være en romskilt liste over klassenavn. For eksempel: class = “className1 className2 className3”
  • Stilattributtet: Dette attributtet lar deg spesifisere reglene for Cascading Style Sheet i ethvert element. Det kan gi ulike Cascading Style-arkeffekter til HTML-elementene som å øke skriftstørrelsen. Det kan også endre skriftfamilie og fargelegging.

Etter kjerneattributtene har vi noen internasjonaliseringsattributter. De er som nedenfor:

Internasjonaliseringsattributt

  • Dir: dir-attributtet hjelper deg med å indikere nettleseren retningen en tekst skal følge. Denne attributtet kan vanligvis ta opp to verdier. Disse kan være LTR og RTL. LTR betyr venstre mot høyre, og dette er standardverdien, mens RTL står for høyre til venstre. Når dette attributtet brukes i taggen, avgjør det hvordan en tekst skal representeres i hele dokumentet. Den kan også brukes til å kontrollere tekstens retning fra bare innholdet i taggen.
  • Lang attributtet: Dette attributtet hjelper til med å vise fram hovedspråket som brukes i et dokument. Denne attributtet kan oppbevares i HTML slik at den er bakoverkompatibel med tidligere versjoner av HTML. Det kan også erstattes av XML: lang attributt i nye XHTML-dokumenter. Verdiene av lang attributter er ISO-639 standard og har to-karakter språkkoder. Å erklære et språk er viktig for å få tilgang til applikasjonen og forskjellige søkemotorer.
  • XML-Lang-attributtet: Dette attributtet er ment å erstatte lang-attributtet. Verdien av XML-lang attributt må ha landskoden som nevnt tidligere.

I tillegg til disse er det mange generiske attributter som er beskrevet nedenfor.

Generisk attributt

  • Juster attributt: Dette attributtet er nyttig når du ønsker å ha noen elementer på siden din til disposisjon. Du kan endre justeringen til venstre, høyre eller midten av siden. Standardinnretningen for alle elementene er satt til venstre. Dette kan endres ved å bruke dette justeringsattributtet.
  • Src-attributt: Hvis en bruker trenger å sette inn et bilde på en webside, må vi bruke tag med src-attributtet. Vi kan spesifisere adressen til bildet som attributtens verdi i dobbelt sitatet. Du kan bruke src-attributtet som nedenfor for å inkludere bildet på websiden.


src Attribute


  • Alt attributt: Dette attributtet brukes som en alternativ tagg som kan brukes til å vise noe hvis det primære attributtet som er -kode som ikke klarer å vise den opprinnelige verdien som er tilordnet den. Dette kan beskrive bildet til en utvikler som bruker det i kodingen. Hvis hovedbildet mislykkes, kan det alternative bildet brukes til å vise.
  • Bredde og høyde attributt: Dette attributtet kan brukes til å justere høyden og bredden på et bilde.

Example:

Width and Height


<

  • Href-attributtet: Dette attributtet brukes når brukeren vil henvise til en spesifikk lenke til hvilken som helst adresse. Dette attributtet brukes sammen med tag. Når lenken er plassert i href-attributtet der den skal rettes, kobles den til teksten som vises i taggen. Når brukeren klikker på denne teksten, vil brukeren bli omdirigert til linkens adresse. Standardalternativet for å åpne denne siden i samme fane. Hvis du bruker målattributtet, kan du sette verdien til _blank. Dette vil omdirigere til en annen fane eller et annet vindu basert på nettleserkonfigurasjonen.

Dataattributt

HTML gir også tilpassede dataattributter som hjelper deg å legge til informasjon relatert til deg i HTML-koder. Disse er ikke spesifikke for HTML5 og kan brukes på alle HTML-elementer. Data - * attributtet hjelper oss med å tilpasse våre egne tilpassede dataattributter, det kan lagre dataene privat på siden eller applikasjonen.

For å tilpasse er dataene delt inn i to deler:

  1. Attributtnavn: Den skal ha minst ett tegn og skal ikke ha store bokstaver. Dette navnet kan også prefikseres ved å bruke 'data-'.
  2. Attributtverdi: Verdien for et attributt kan være en hvilken som helst streng.

Syntaks for dataattributt er som:

  • Gitanjali

    • DOM Attributt eiendom

    For å få NamedNodeMap-objektene, skal attributtegenskapene i HTML DOM brukes. Det vil returnere gruppen av nodeattributter. NamedNodeMap representerer også samlingen av attributtobjekter, og det kan nås med indeksnummer. Dette indeksnummeret starter på 0.

    Syntaksen for å bruke dette er: node.attributter

    Verdien som returneres er NamedNodeMap-objektene som er til stede i samlingen av noder. Hvis brukeren bruker Internet Explorer 8 eller noen av de tidligere versjonene, vil attributtsegenskapene returnere alle mulige attributter for ethvert element, og dette kan resultere i flere verdier enn forventet.

    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 attributter

    HTML gir også globale attributter som kan brukes med alle HTML-elementer. Attributtene er som nedenfor.

    • Accesskey: Den spesifiserer en snarveistast for å aktivere eller fokusere på ethvert element.
    • Oversett: Hvis dette attributtet brukes, spesifiserer det om innholdet i elementet skal oversettes eller ikke.
    • Klasse: Den spesifiserer ett eller flere klassenavn for et element.
    • Tittel: Dette attributtet spesifiserer ekstra informasjon om et element.
    • Contenteditable: For å spesifisere om innholdet er redigerbart eller ikke, kan dette attributtet brukes.
    • Tabindex: Den spesifiserer fanebestillingen for et element.
    • Dir: Den spesifiserer tekstretningen for innholdet i et element.
    • Stavekontroll: Bruker kan eksplisitt spesifisere om de må kontrollere stavingen og grammatikken som er sjekket eller ikke.
    • Draggable: Den spesifiserer om et element skal være dragbart eller ikke.
    • Dropzone: Den spesifiserer om de dratte dataene skal kopieres, flyttes eller kobles når de slippes.

    Hendelsesattributter

    HTML har muligheten til å utløse handlinger når noen hendelser finner sted. Hendelsesattributtene kan være som nedenfor.

    Onload: Den avfyrer etter at siden er ferdig lastet.

    Onmessage: Dette kan sies som et skript som kjøres når meldingen utløses.

    Onstorage: Dette er et skript som skal kjøres når et nettlagringsområde oppdateres.

    Onerror: Dette skriptet kjøres når det oppstår en feil.

    Onpagehide: Dette skriptet kan brukes når en bruker kan navigere bort fra en side.

    Form hendelsesattributter

    Disse hendelsene utløses av handlinger i en HTML-skjema.

    Onblur: Det utløses så snart elementet mister fokus.

    Utveksling: Det utløses så snart verdien til et element endres.

    Oncontextmenu: Dette kjøres når en hurtigmeny utløses.

    Onfocus: Det utløses så snart elementet får fokus.

    Oninput: Skriptet må kjøres når elementet mottar innspill.

    Onsearch: Dette utløses når brukeren skriver noe i søkefeltet.

    Oninvalid: Dette utløses når et element som er lagt inn er ugyldig.

    Viktige hendelsesattributter

    Onkeydown: Det utløses når du trykker på en tast.

    onkeypress: Dette utløses når du trykker på en tast.

    Onkeyup: Dette utløses når en bruker slipper en nøkkel.

    Mushendelsesattributter

    Onclick: Dette utløses når musen klikker på et element.

    Onmousemove: Dette avfyres når musepekeren beveger seg mens den er over et element.

    Onmouseip: Det utløses når en museknapp frigjøres fra over et element.

    Onwheel: Det utløses når musehjulet ruller opp eller ned over et element

    Dra hendelsesattributter

    Ondrag: Dette utløses når et element dras.

    Ondragleave: Skriptet kjøres når et element forlater et gyldig slippmål .

    Ondrop: Det utløses når det dratte elementet slippes

    Oncroll: Skriptet kjøres når et elements rullefelt rulles.

    Konklusjon - HTML attributter

    HTML er den eldste teknologien som brukes til å lage forskjellige webapplikasjoner. Med tiden har HTML utviklet seg gradvis og gir mange funksjoner for elementene som er til stede. Det gir et bredt utvalg av attributter som hjelper deg med å gjøre applikasjonen mer effektiv. Disse inkluderer kjerneattributter som er de grunnleggende som blir brukt hyppigst. Det gir også internasjonaliseringsattributter som muliggjør språkendringer. Dataattributtet hjelper til med å lagre data og tilpasse dem slik brukeren vil ha dem. Med alle disse har den også globale attributter som kan brukes med ethvert element og hvor som helst. Den har også hendelsesattributter som utløses når noen form for hendelse finner sted. Som et resultat gjør det webapplikasjonen eller websiden veldig interaktiv. HTML viser seg dermed å være fortsatt med i utviklingen av webapplikasjoner på grunn av alle disse funksjonene. Med disse gjør stilattributtet som kan brukes med CSS det vakrere og mer attraktivt å bruke. Så gjør bruk av alle attributtene som er til stede og har en fantastisk nettapplikasjon du velger, på den enkle måten.

    Anbefalte artikler

    Dette har vært en guide til HTML-attributter. Her har vi diskutert konsepter og forskjellige attributter til HTML. Du kan også se på følgende artikler for å lære mer -

    1. Hva er HTML i enkle ord?
    2. Lær hvordan HTML fungerer
    3. Hva er XML?
    4. Topp HTML-listestiler
    5. Sammenligninger av HTML vs XML

    Kategori:

    Nettutviklingsverktøy