Sometimes, we want to set multiple attributes for an element at once with JavaScript.
In this article, we’ll look at how to set multiple attributes for an element at once with JavaScript.
How to set multiple attributes for an element at once with JavaScript?
To set multiple attributes for an element at once with JavaScript, we can call the element’s setAttribute
method.
For instance, we write
const setAttributes = (el, attrs) => {
for (const [key, val] of Object.entries(attrs)) {
el.setAttribute(key, val);
}
};
const attrs = {
src: "http://example.com/something.jpeg",
height: "100%",
//...
};
setAttributes(elem, attrs);
to define the setAttributes
function.
In it, we use a for-of loop to loop through each property that we get from Object.entries
.
In the loop, we call el.setAttribute
with key
and val
to set attribute with name key
to val
.
Then we call setAttributes
with the elem
element and the attrs
object with the attributes we want to set.
Conclusion
To set multiple attributes for an element at once with JavaScript, we can call the element’s setAttribute
method.