あきぞらです。
CSSをJavaScriptで動的に変更したいとき、ありますよね。
JQueryでないES2015などでの書き方を知りたいときに「あれ？」となったので、
今回はその方法を紹介していきます。
JavaScriptで動的にCSSを変更する
たとえば、こんなHTMLがあったとします。
<div class='test-msg-box'>
テスト
</div>
これのstyleをいじってみます。
このdivを「display: none」にしたいときは、このようにかきます。
const testMsgBox = document.querySelector('.test-msg-box')
testMsgBox.style.display = 'block'
JQueryに比べると、若干めんどうですよね。
ただ、Vue.jsなどを利用しているとあまり使うことがないかもしれません。
ですが、使うときに「あれ？」とならないように覚えておくとよいと思います！