HTML атрибути

HTML атрибутите могат да се кажат като специални думи, които се използват вътре в отварящите маркери и са отговорни за контрола на поведението на даден елемент. Те са модификатор на типа HTML елементи. Този модификатор може да свърши две задачи. Той може или да променя функционалността по подразбиране на даден елемент, или може да осигури функционалността на всеки елемент, който не е в състояние да функционира правилно без тях. Синтактично, атрибут се добавя към HTML маркера. Има различни видове атрибути, които са идентифицирани. Те включват необходимите атрибути, незадължителни атрибути, стандартни атрибути и атрибути на събитията. Необходимите атрибути са тези, които са необходими за определен тип елементи, така че функцията да работи правилно. Незадължителният атрибут може да се използва за промяна на функцията по подразбиране на типа елемент. Стандартните атрибути се поддържат от голям брой елементи и атрибутите на събитията могат да се използват за причиняване на типове елементи, които могат да определят скриптове, които се изпълняват при конкретни обстоятелства. Атрибутите обикновено се появяват като двойки име-стойност и са разделени с '=' (знак за равенство). Те се записват в началния маркер на елемент след името на елемента.

Различни HTML атрибути

Нека да разгледаме различни HTML атрибути и как те работят в подробности.

Основни атрибути

Има четири основни атрибута, които се използват основно. За да ги наречем, те са както следва:

  • ИД: Този атрибут на HTML може лесно да се използва за идентифициране на елемент, който присъства в HTML страница. Потребителският идентификатор може да се използва или когато елемент носи атрибут id като уникален идентификатор, което позволява да се идентифицира елементът и неговото съдържание, или това се използва, когато има два елемента, които имат едно и също име в уеб страница. Атрибутът ID може да помогне за лесно идентифициране на разликата между елементите, които имат същото име.
  • Атрибут на заглавието: Този атрибут върши работата по даването на предложено заглавие за определен елемент. Зависи от носителя как ще се държи и въпреки че обикновено не се показва като подсказка, когато курсорът стигне елементът или ако трябва да го покаже, когато елементът се зарежда. Използва се и за обяснение на елемент върху движение на мишката върху него. Поведението може да се различава при различните елементи и като цяло стойността му се показва при зареждане или при движение на курсора на мишката върху него.
  • Клас Атрибут: Свързването на този атрибут се извършва с елемент от таблицата със стилове. Потребителят трябва да посочи класа на елемента. Повече може да се научи за този атрибут, когато се научи лист Cascading Style. Стойността тук може също да бъде разделен с интервал списък от имена на класове. Например: class = „className1 className2 className3“
  • Атрибут на стила: Този атрибут ви позволява да укажете правилата за каскаден стилов лист в рамките на всеки елемент. Той може да предостави различни ефекти на лист Cascading Style на HTML елементи като увеличаване на размера на шрифта. Той може също да промени семейството на шрифта и оцветяването.

След основните атрибути имаме някои атрибути на интернационализация. Те са както по-долу:

Атрибут за интернационализация

  • Dir: Атрибутът dir ви помага да посочите на браузъра посоката, в която трябва да следва текст. Този атрибут обикновено може да поеме две стойности. Това могат да бъдат LTR и RTL. LTR означава отляво надясно и това е стойността по подразбиране, докато RTL означава отдясно наляво. Когато този атрибут се използва в тага, той определя как един текст трябва да бъде представен в целия документ. Може да се използва и за управление на посоката на текста само от съдържанието на маркера.
  • Атрибут Lang: Този атрибут помага за показване на основния език, който се използва в документ. Този атрибут може да се запази в HTML, така че да е обратно съвместим с по-ранните версии на HTML. Той може също да бъде заменен от XML: lang атрибут в нови XHTML документи. Стойностите на атрибутите на lang са стандарт ISO-639 и имат кодове на два знака. Декларирането на език е важно за достъп до приложението и различни търсачки.
  • Атрибут XML-Lang: Този атрибут трябва да бъде заместител на атрибута lang. Стойността на атрибута XML-lang трябва да има кода на държавата, както беше споменато по-горе.

В допълнение към тях има много общи характеристики, които са описани по-долу.

Родов атрибут

  • Подравняване на атрибута: Този атрибут е полезен, когато искате да разполагате с някои елементи на страницата си. Можете да промените подравняването вляво, вдясно или в центъра на страницата. Подравняването по подразбиране за всички елементи е зададено вляво. Това може да се промени с помощта на този атрибут за подравняване.
  • Src Attribute: Ако потребителят трябва да вмъкне изображение в уеб страница, тогава трябва да използваме маркер с атрибута src. Можем да определим адреса на изображението като стойност на атрибута вътре в двойния цитат. Можете да използвате атрибута src по-долу, за да включите изображението в уеб страницата.


src Attribute


  • Alt Attribute: Този атрибут се използва като алтернативен маркер, който може да се използва за показване на нещо, ако основният атрибут е маркер, който не успява да покаже оригиналната стойност, която му е присвоена. Това може да опише изображението на програмист, който го използва в края на кодирането. Ако основното изображение не успее, тогава алтернативното изображение може да се използва за показване.
  • Атрибут Width and Height: Този атрибут може да се използва за регулиране на височината и ширината на изображението.

Example:

Width and Height


<

  • Атрибут Href: Този атрибут се използва, когато потребителят иска да се насочи към конкретна връзка към който и да е адрес. Този атрибут се използва заедно с маркер. Когато връзката е поставена в атрибута href, където трябва да бъде насочена, тя е свързана с текста, показан в маркера. Когато потребителят кликне върху този текст, той ще бъде пренасочен към адреса на връзката. Опцията по подразбиране за отваряне на тази страница в същия раздел. Ако използвате целевия атрибут, тогава можете да зададете неговата стойност на _blank. Това ще пренасочи към друг раздел или друг прозорец въз основа на конфигурацията на вашия браузър.

Атрибут на данни

HTML също предоставя атрибути на персонализирани данни, които ви помагат да добавяте информация, свързана с вас, в HTML маркери. Те не са специфични за HTML5 и могат да се използват за всички HTML елементи. Атрибутът data - * ни помага да персонализираме собствените си атрибути на персонализирани данни, той може да съхранява данните частно на страницата или приложението.

За да персонализирате, данните са разделени на две части:

  1. Име на атрибута: Трябва да има поне един знак и не трябва да има главни букви. Това име може да се префиксира и с помощта на „data-“.
  2. Стойност на атрибута: Стойността за един атрибут може да бъде всеки низ.

Синтаксисът за атрибут на данни е както:

  • Gitanjali

    • DOM Attribute Property

    За получаване на обектите NamedNodeMap трябва да се използват свойствата на атрибутите в HTML DOM. Той ще върне групата атрибути на възел. NamedNodeMap също представлява колекцията от атрибутни обекти и може да бъде достъпна чрез номер на индекса. Този номер започва с 0.

    Синтаксисът да се използва това е: node.attributes

    Върнатата стойност е NamedNodeMap обекти, които присъстват в колекцията от възли. Ако потребителят използва Internet Explorer 8 или някоя от по-ранните версии, тогава свойството атрибути ще върне всички възможни атрибути за всеки елемент и това може да доведе до повече стойности от очакваното.

    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

    Глобални атрибути

    HTML също предоставя глобални атрибути, които могат да се използват с всеки HTML елемент. Атрибутите са както по-долу.

    • Accesskey: Той определя клавиш за бърз достъп, за да активира или фокусира върху всеки елемент.
    • Превод: Ако се използва този атрибут, той определя дали съдържанието на елемента трябва да бъде преведено или не.
    • Клас: Определя едно или повече имена на клас за даден елемент.
    • Заглавие: Този атрибут определя допълнителна информация за даден елемент.
    • Contenteditable: За да се определи дали съдържанието може да се редактира или не, този атрибут може да се използва.
    • Tabindex: Той определя реда на табулиране на елемент.
    • Dir: Тя посочва текстовата посока за всяко съдържание на елемент.
    • Проверка на правопис: Потребителят може изрично да посочи дали трябва да провери правописа и граматиката проверени или не.
    • Драгируем: Указва дали елементът трябва да бъде преместваем или не.
    • Dropzone: Указва дали изтеглените данни се копират, преместват или свързват при отпадане.

    Атрибути на събитията

    HTML има възможност да задейства действия, когато се случват някои събития. Атрибутите на събитието могат да бъдат както по-долу.

    Onload: Той се задейства след приключване на зареждането на страницата.

    Onmessage: Това може да се каже като скрипт, който се стартира при задействане на съобщението.

    Onstorage: Това е скрипт, който трябва да се стартира, когато се актуализира уеб пространството за съхранение.

    Onerror: Този скрипт се изпълнява, когато възникне грешка.

    Onpagehide: Този скрипт може да се използва, когато потребителят може да се отдалечи от дадена страница.

    Форма атрибути на събитието

    Тези събития се задействат от действия вътре в HTML форма.

    Onblur: Той се задейства веднага щом елементът загуби фокуса.

    Onchange: Той се задейства веднага щом стойността на даден елемент се промени.

    Oncontextmenu: Това се стартира, когато се задейства контекстно меню.

    Onfocus: Той се задейства веднага щом елементът се фокусира.

    Oninput: Скриптът трябва да се изпълни, когато елементът получи вход.

    Onsearch: Това се задейства, когато потребителят напише нещо в полето за търсене.

    Oninvalid: Това се задейства, когато въведеният елемент е невалиден.

    Основни атрибути на събитието

    Onkeydown: Задейства се при натискане на клавиш.

    onkeypress: Това се задейства при натискане на клавиш.

    Onkeyup: Това се задейства, когато потребителят пусне ключ.

    Атрибути на събитието на мишката

    Onclick: Това се задейства, когато мишката щракне върху елемент.

    Onmousemove: Това се задейства, когато показалецът на мишката се движи, докато е над елемент.

    Onmouseip: Той се задейства, когато бутонът на мишката се освободи от над елемент.

    Onwheel: Той се задейства, когато колелото на мишката се преобърне нагоре или надолу върху елемент

    Плъзнете атрибути на събитието

    Ondrag: Това се задейства, когато елемент се влачи.

    Ondragleave: Скриптът се изпълнява, когато елемент остави валидна цел на капка.

    Ondrop: Той се задейства при отпадане на влачещия елемент

    Onscroll: Скриптът се изпълнява, когато лентата за превъртане на елемент се превърта.

    Заключение - HTML атрибути

    HTML е най-старата технология, която се използва за създаване на различни уеб приложения. С времето HTML се развива постепенно и предоставя много функции за присъстващите елементи. Той предоставя голямо разнообразие от атрибути, които помагат да се направи приложението по-ефективно. Те включват основните атрибути, които са основни, се използват най-често. Той също така предоставя атрибути на интернационализация, които позволяват промяна на езиците. Атрибутът на данните помага при съхраняването на данни и персонализирането им по начина, по който потребителят иска. С всичко това той има и глобални атрибути, които могат да се използват с всеки елемент и навсякъде. Той също има атрибути на събитията, които се задействат, когато се проведе какъвто и да е вид събитие. В резултат на това прави уеб приложението или уеб страницата много интерактивни. Поради това HTML се оказва все още в играта за разработка на уеб приложения поради всички тези функции. С тях атрибутът стил, който може да се използва с CSS, го прави по-красив и привлекателен за използване. Затова използвайте всички присъстващи атрибути и имате страхотно уеб приложение по ваш избор по лесния начин.

    Препоръчителни статии

    Това е ръководство за HTML атрибути. Тук сме обсъдили концепциите и различните атрибути на HTML. Можете също да разгледате следните статии, за да научите повече -

    1. Какво е HTML в прости думи?
    2. Научете как работи HTML
    3. Какво е XML?
    4. Най-добрите стилове на HTML списъци
    5. Сравнения на HTML спрямо XML

    Категория:

    Инструменти за уеб разработка