{"id":6818,"date":"2013-01-25T10:50:37","date_gmt":"2013-01-25T10:50:37","guid":{"rendered":"http:\/\/vskills.in\/certification\/tutorial\/?p=6818"},"modified":"2024-04-12T14:13:27","modified_gmt":"2024-04-12T08:43:27","slug":"attribute-groups-2","status":"publish","type":"page","link":"https:\/\/www.vskills.in\/certification\/tutorial\/attribute-groups-2\/","title":{"rendered":"Attribute Groups"},"content":{"rendered":"

Attribute Groups<\/strong><\/h4>\n

In HTML5, you can use attribute groups to specify a set of related attributes for an element. Attribute groups are not a formal part of the HTML5 specification, but they are a common practice used by many developers to make their HTML code more organized and easier to read.<\/p>\n

To define an attribute group, you can create a new attribute with a name that represents the group, and then add a list of related attributes to that group. For example, you might create an attribute group called “form input attributes” that includes the name, value, type, and required attributes commonly used with form input elements:<\/p>\n

<!DOCTYPE html><\/p>\n

<html><\/p>\n

<head><\/p>\n

<meta charset=”UTF-8″><\/p>\n

<title>Attribute Groups<\/title><\/p>\n

<\/head><\/p>\n

<body><\/p>\n

<form><\/p>\n

<label><\/p>\n

Name:<\/p>\n

<input name=”name” value=”” type=”text” required><\/p>\n

<\/label><\/p>\n

<label><\/p>\n

Email:<\/p>\n

<input name=”email” value=”” type=”email” required><\/p>\n

<\/label><\/p>\n

<label><\/p>\n

Password:<\/p>\n

<input name=”password” value=”” type=”password” required><\/p>\n

<\/label><\/p>\n

<\/form><\/p>\n

<\/body><\/p>\n

<\/html><\/p>\n

In this example, the name, value, type, and required attributes are all related to form input elements and can be grouped together for clarity. By using attribute groups, you can make your code easier to read and maintain, especially for larger documents with many similar elements.<\/p>\n

Note that attribute groups are not a formal part of the HTML5 specification, and they are not supported by all browsers or tools. However, many developers find them useful for organizing their code and improving readability.<\/p>\n

Attributes are given in the opening tag of an element and have a name and a value pair. The name part of attribute is actually a property of the element and value gives a value (whether text or number) for that property like, \u2018xmlns\u2019 attribute describes the XML namespace for the XHTML document to refer to and to specify XHTML 1.0 namespace a value of \u201chttp:\/\/www.w3.org\/1999\/xhtml\u201d is given.<\/p>\n

Attributes are divided into three groups which are<\/p>\n

Core attributes<\/strong>: It consist of class, id and title attributes<\/p>\n

Internationalization attributes<\/strong>: It consist of dir, lang and xml:lang attributes<\/p>\n

UI event attributes<\/strong>: They are linked to events like onclick, ondoubleclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown onkeyup<\/p>\n

Core and internationalization attributes together are also called universal attributes.<\/p>\n

The attribute groups are<\/p>\n