Global Attributes
HTML global attributes are those attributes which are common for all HTML elements. The global attributes are supported by both standard and non-standard element.
The global attributes can be used with all elements, although it may not have any effect on some elements.
Following is the complete list of global attributes with their description:
Hererepresent new in HTML5.
Attributes | value | Description |
---|---|---|
accesskey | character | It is used to generate keyboard shortcuts for the current element. |
class | classname | It is used to provide the class name for the current element. It is mainly used with the stylesheet. |
Contenteditable | true false | It determines whether the content within an element is editable or not. |
contextmenu | menu_id | It defines the id for the <menu> element which is used as a context menu (a menu appear on right click) for an element. |
data-* | somevalue | It is used to store element-specific private data which can be accessed by Javascript. |
dir | rtl ltr auto | It specifies the direction of the content inside the current element. |
draggable | true false auto | It specifies whether the content within an element is movable or not using Drag and Drop API. |
dropzone | copy move link | It specifies the action is taken on the dragged element when it is dropped, ¬¬ such as whether it is copied, moved or linked. |
hidden | It is used to hide the element from view. | |
id | id | It specifies a unique id for the element. It can be used with CSS and JavaScript. |
lang | language_code | It specifies the primary language for the content of an element. |
style | style | It is used to apply inline CSS to the current element. |
spellcheck | true false | It specifies whether the content should be checked for spelling errors or not. |
tabindex | number | It determines the tabbing order of an element. |
title | text | It is used to provide the title, name, or some extra information about the element. |
translate | yes no | It specifies whether the content of the element should be translated when the page is localized or not. |
HTML Event Attributes
When a browser reacts on user action, then it is called as an event. For example, when you click on the submit button, then if the browser displays an information box.
In HTML5 there are lots of event attributes available which can be activated using a programming language such as JavaScript.
Following is a table of event attributes, using these attributes you can perform several events.
Windows Event Attributes
Windows events are related for the window object, and it can only be applied with <body> tag.
Attribute | Description |
---|---|
onafterprint | Executed the script after the document is printed. |
onbeforeprint | Executed the script before the document is printed. |
onbeforeunload | Executed the script before a document being unloaded. |
onerror | Executed the script when an error occurs. |
onhashchange | Executed the script when the anchor part in URL of the webpage is changed. |
onload | Executed the script when the webpage is entirely loaded. |
onmessage | Executed the script when a message event occurs. |
onoffline | Executed the script when the network connection is disconnected, and browser started working offline. |
ononline | Executed the script when the browser started working online |
onpagehide | Executed the script when the current webpage is hidden such as if the user has moved away from the current webpage. |
onpageshow | Executed the script when the current webpage is focused. |
onpopstate | Executed the script when the window's active history is changed. |
onresize | Executed the script when the window is resized. |
onstorage | Executed the script when web storage is updated. |
onunload | Executed the script when the current webpage is unloaded, or window is closed. |
Form Event Attributes
Form event occurs when the user performs some action within the form such as submitting the form, selecting input field, etc.
The form events can be used with any element, but these are mainly used with HTML form elements.
Following is the list of all Form Event attributes:
Attribute | Description |
---|---|
onblur | Executed the script when form element loses the focus. |
onchange | Executed the script when the value of the element is changed. |
onfocus | Trigger an event when the element gets focused. |
oninput | Executed the script when the user enters input to the element. |
oninvalid | Executed the script when the element does not satisfy its predefined constraints. |
onreset | Triggers the event when user reset the form element values. |
onsearch | Triggers the event when a search field receives some input. |
onselect | Triggers the event when the user has selected some text. |
onsubmit | Triggers the event when a form is submitted. |
Keyboard Event Attributes
Keyboard event occurs when a user interacts with the keyboard. Following is a list of the Keyboard event.
Attribute | Description |
---|---|
onkeydown | Triggers the event when the user presses down a key on the keyboard. |
onkeypress | Trigger the event when the user presses the key which displays some character. |
onkeyup | Trigger the event when the user releases the currently pressed key. |
Mouse Event Attributes
Attribute | Description |
---|---|
onclick | Trigger the event when the mouse clicks on the element. |
ondblclick | Trigger the event when mouse double-click occurs on the element. |
onmousedown | Trigger the event when the mouse button is pressed on the element. |
onmousemove | Trigger the event when the mouse pointer moves over the element. |
onmouseout | Trigger the event when the mouse moves outside the element. |
onmouseover | Trigger the event when the mouse moves onto the element. |
onmouseup | Trigger the event when the mouse button is released. |
onmousewheel | Deprecated. Use the onwheel attribute. |
onwheel | Trigger the event when the mouse wheel rolls up or down on the element |
Clipboard Event Attributes
Attribute | Description |
---|---|
oncopy | Trigger the event when the user copies the content to the system clipboard. |
oncut | Trigger the event when the content of an element is cut and copy to the clipboard. |
onpaste | Trigger the event when the user pastes some content in an element. |
Media Event Attributes
Attribute | Description |
---|---|
onabort | Executed the script when media playback is aborted. |
oncanplay | Executed the script when the media file is ready to play. |
oncanplaythrough | Executed the script when the media file is ready to play without buffering or stopping. |
oncuechange | Executed the script text cue of <track> element is changed. |
ondurationchange | Executed the script when the media file duration is changed. |
onemptied | Executed the script if media occurs some fatal error, and the file becomes unavailable. |
onended | Executed the script when the media file occurs its end point. |
onerror | Executed the script when some error occurred while fetching the media data. |
onloadeddata | Executed the script when media data is loaded. |
onloadedmetadata | Executed the script when metadata of media file is loaded. |
onloadstart | Executed the script when loading of media file starts. |
onpause | Executed the script when media playback is paused. |
onplay | Executed the script when media file ready to play after being paused. |
onplaying | Executed the script when media file is started playing. |
onprogress | Executed the script when the browser is in the process of getting the media data. |
onratechange | Executed the script when playback speed changed. |
onseeked | Executed the script when seek operation is ended and seeking attribute is set to false. |
onseeking | Executed the script when seek operation is active and seeking attribute is set to true. |
onstalled | Executed the script when browser unexpectedly stopped fetching the data media. |
onsuspend | Executed the script if fetching of media data is intentionally stopped. |
ontimeupdate | Executed the script when playback position is changed, such as if a user fasts forward the track. |
onvolumechange | Executed the script when media volume is changed (muted or unmuted). |
onwaiting | Executed the script if playback pause to wait for loading more data |
0 Comments