The Difference Between HTML Attributes and JavaScript Object Properties | HOW TO - Code Samples

#coding #codingbootcamp #softwaredeveloper #codeyourfuture

I’ve seen a lot of folks using the term “attribute’ interchangeably between HTML and JavaScript the past year. Some of it stems from a garbage translation layer/ruleset doing so, but on the whole it reeks of utter ignorance to say they are the same thing.

And yes, PROPERTY. Can we at least agree on the basic terminology?

Attribute —the key in a key/value pair used on a tag in a markup language

Property — A variable that’s attached to an object.

Method — A function that’s attached to an object.

Getter & Setter —Methods that behave like properies

If you are calling them something other than that or using them interchangeably, you’re talking out your arse!

Probably the best example of this can be found in the difference between all the different ways of getting an HTMLInputElement’s value and default.

I’ve lost count of the number of times I’ve seen people not only claim that HTML attributes and DOM properties are the same thing, and have code go bits-up face-down because of that ridiculously ignorant claim. There is a reason setAttribute and getAttribute exist on DOM Elements separate from their Element property equivalents.

Bottom line though, if it’s on the DOM in a JavaScript object, it’s not an “attribute” anymore, stop saying that!

Lots of Great How Tos and Code Samples! Make sure to like and subscribe!