Extra information about conventional HTML elements without a visual representation is stored in custom data-* attributes. The purpose of these characteristics is to hold information that JavaScript will need.
Key points:
Example:
<article id="post" data-author="Jay" data-published="2024-05-04">
<h2>Custom Data Attributes</h2>
<p>Data stored in this element can be used by scripts.</p>
</article>
let article = document.querySelector('#post');
console.log(article.dataset.author); // Outputs: Joy console.log(article.dataset.published); // Outputs: 2024-05-04
These advanced attributes (class, id, style, and data-*) provide a powerful approach to control styling, behavior, and custom data within a webpage. They also improve the functionality and interaction of HTML elements with CSS and JavaScript. When used properly, they can significantly improve web development projects' performance, maintainability, and efficiency.
Extra information about conventional HTML elements without a visual representation is stored in custom data-* attributes. The purpose of these characteristics is to hold information that JavaScript will need.
Key points:
Example:
<article id="post" data-author="Jay" data-published="2024-05-04"> <h2>Custom Data Attributes</h2> <p>Data stored in this element can be used by scripts.</p> </article>
let article = document.querySelector('#post'); console.log(article.dataset.author); // Outputs: Joy console.log(article.dataset.published); // Outputs: 2024-05-04
These advanced attributes (class, id, style, and data-*) provide a powerful approach to control styling, behavior, and custom data within a webpage. They also improve the functionality and interaction of HTML elements with CSS and JavaScript. When used properly, they can significantly improve web development projects' performance, maintainability, and efficiency.
Use the <link> tag inside the <head> to attach an external CSS file.
Comments in HTML are written between <!-- and -->.
HTML entities are used to display reserved or special characters.
The <iframe> tag embeds another webpage within the current page.
The id attribute uniquely identifies a single HTML element.
Hyperlinks are created using the <a> tag with an href attribute.
Use the <img> tag and specify the image source with the src attribute.
Use the target="_blank" attribute inside the <a> tag.
Copyrights © 2024 letsupdateskills All rights reserved