HTML Tutorial — Attributes (5/11)
Attributes allow us to specify the behavior or the functionality of our elements. Sometimes the element itself is not enough for the browser to know what you want.
There are a lot of different kinds of attributes, let’s look at a practical one:
HREF - what??? If you have an A or ANCHOR tag, which is a link to another page, how do you know where to link to? A link is not enough information, you also need to say where you want your link to go to? So that the browser can direct the user to that link. To do that, you use an attribute called HREF, which is short of hypertext reference. The name makes no sense anymore but now you know what it does.
Some of the other popular attributes are:
CLASS - It's an identifier, used heavily in CSS for styling your elements.
ID - Also used as a unique identifier, I’ll tell you why that’s important later.
How do you use attributes?
In the opening tag you put a space after the name of the tag and write your attribute name = and then in “” you put in the value of your attribute. So let’s do an HREF.
Some attributes needs a value like HREF, some don’t. Like when you wanna say disable a button. Disabled is disabled, you don’t need any more information, so as soon as you add it to a button, it can’t be clicked anymore. Like this. Here is how a browser renders a regular button, and here’s one that’s disabled. Can’t click it yo!
Disabled is an optional attribute, your button doesn’t need it in order to survive. But HREF is a required attribute, your A tag will be incomplete without it.
So there are Required attributes, optional attributes, there are also EVENT attributes. Which respond to certain USER GENERATED events, like user clicks, or moves the mouse around, or hover and some other stuff.
We’ll learn more about attributes once we start using them in our app. Just remember that attributes are a way of specifying the behavior and functionality of your element, use them wisely, they are powerful, and don’t forget some are required and some are optional.