jQuery IDやClass指定でスタイルを変える

jQuery IDやClass指定でスタイルを変える

jQueryを用いてHTMLで書かれた要素を後から変更をかけたいということが、よくあります。本件ではスタイルを変更するために、クラスを追加するサンプルを用意しました。

当然ですが、スタイルを変更したい場合は、単純にスタイルシートを上書きすることが描画の上で最速になります。

ここではあえて、HTMLの全ての描画が終わった後でClassを追加してスタイルを変更する方法を紹介します。

サンプルはこちら

この部分のスタイルを変える
<div id="demo_1">この部分のスタイルを変える</div>
<style>
.demo_class{
color:#FFF;
background-color:#000;
}
</style>
<script type="text/javascript" src="/js/jquery/jquery-2.1.0.min.js"></script>
<script>
$(document).ready(function(){
  var my_id = "#demo_1";
  var my_class = "demo_class";
  $(my_id).addClass(my_class);
});
</script>
2016-07-19 01:33:39

関連するサンプル

人気記事ランキング

© 2018 kipure
Top