ハッシュを使用することで、複数のスタイルをまとめて設定することができる。
ハッシュで指定する場合、CSSのプロパティ名は以下のようにキャメルケースとなるため注意。
background-color → backgroundColor
- アイテム１
複数スタイルをまとめて設定。
■HTML
|
1 2 3 4 5 6 |
<ul id="list1"> <li id="item1">アイテム１</li> </ul> <br> <input type="button" id="button1" value="CSSを変更1"/> 複数スタイルをまとめて設定。<br> <input type="button" id="button-reset" value="CSSをリセット"/><br> |
■JavaScript
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
jQuery(function($) { //id属性を持つli要素にスタイルを設定する。 $('#button1').click(function(e) { $('#list1 li').css({ backgroundColor : 'yellow', border : 'solid 2px Lime', color : "red", }); }); //id=list配下すべての要素のstyleをリセット $('#button-reset').click(function(e) { $('#list1 *').removeAttr('style'); }); }) |