0

I was using the setAttribute method and noticed that if I use it consecutively, only the first time I use it the DOM elements changes, whereas the second time it doesn't work. And i don't understand why.

example, if i write this:

grid.setAttribute("style", `grid-template-rows:repeat(auto-fill,${width/size}px);`);
grid.setAttribute("style", `grid-template-columns:repeat(auto-fill,${width/size}px);`);

only the grid-template-rows changes.

But if i put it all in one line like this:

grid.setAttribute("style", `grid-template-columns:repeat(auto-fill,${width/size}px); grid-template-rows:repeat(auto-fill,${width/size}px);`);

then both values change, which gives the desired outcome.

Can anyone explain me why the first instance doesn't work?

Improve this question
4
  • 4
    when you use setAttribute it will always replays old one, it's not append ! Commented Jun 15, 2020 at 11:31
  • 2
    You shouldn't use setAttribute to set styles anyway, instead use grid.style.gridTemplateColumns = ... -- or better still use classes. Commented Jun 15, 2020 at 11:32
  • 1
    Does this answer your question? Append new attribute with setAttribute()? Commented Jun 15, 2020 at 11:37
  • thank you so much guys for the help!! I got it now :) Commented Jun 15, 2020 at 18:02
Related questions
1
JavaScript setAttribute alternative
1
javascript setAttribute
0
setattribute in javascript
Load 7 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.