Attributes are an element of an HTML document while properties are a part of the Document Object Model (DOM).
Example : <input type="text" value="Tech">
Here, value and type are the attributes of HTML, but when the statement is read by the browser and parses this code it will make a DOM with different properties, like accept, autofocus, accessKey, baseURI, checked, childElementCount, align, alt, childNodes, children, classList, className, attributes, and clientHeight.
Example :
var data = document.querySelector(input); // here we created a document object of input tag
console.log(input.getAttribute('value')); // tech // getting the attribute value
console.log(input.value); // tech // getting the property of the input object
