JavaScript

CSSのプロパティをJavaScriptで指定する

js_style

Elementオブジェクトのstyleプロパティで
その要素に対して個別にCSSスタイルを設定できます。

普段はjQueryでやってるので
JavaScriptでどうやるんだろうとは思ってました。

jQueryのほうが直感的に指定できて、
コードの可読性もあるんですが、
動作が遅いんですよね、jQueryって^^;

だから
すばやくCSSを切り替える必要があるときに使います。

とくにWebアプリとかで、ゲームなんかつくってたりすると
使う必要はあるでしょうね。

1
2
var elem = document.getElementsByName('hoge');
elem.style.background = 'red';

ただし、注意することがあります。
どうやらIDやクラスを利用したCSSスタイル設定よりも
優先されるみたいなんです。
気をつけないとガタガタ崩れちゃいそうですね。

▼基本がわかります

関連記事

  1. JavaScript

    「offset」で取得した値を使い回す

    ちょっとはまったのでメモ。以下のように「offset」と「sty…

  2. JavaScript

    配列に入れた無名オブジェクトの値をクリアする

    オブジェクトの値を配列にいれて管理することってけっこうあります。…

  3. JavaScript

    「TweenMax.js」をビジネス利用のためのライセンス購入方法

    いつもJavaScriptのアニメーション部分でお世話になってる「…

  4. JavaScript

    WebアプリのデバッグをChromeでやるために「touch events」を有効化する方法

    Webアプリのデバッグは「Chrome」をいつも使ってます。その…

  5. JavaScript

    背景画像をJavaScriptで入れ替える2種類の方法

    ものごとには「正解」というものがひとつではない、ってことが多いもん…

  6. JavaScript

    正規表現で入力されたテキストが有効かをチェックする

    テキストボックスに入力されたテキストが整数かどうかをチェックします…

最近の記事

  1. 進撃の巨人展FINAL チラシ
  2. 【無印良品】ゴールデンウィーク中のご飯にレトルト買い込み!
  3. 世代ど真ん中だった!!『週刊少年ジャンプ展 vol2』
  4. デジタル通貨を買ってみた記録!とりあえず元は取っている!
  5. 【コレクション】カードダス:SDガンダム外伝シリーズ
  6. 懐かしい!!カードダスSD戦国伝!!
  7. 【UNIQLO】ユニクロ誕生感謝祭で買いだめ!

アーカイブ

  1. 日常

    アーティスト撮影
  2. 日常

    「A LETEER TO TRUE」
  3. 日常

    またもや、懐かしい人たちと
  4. 「第29回 新日本写真全国公募」入選!

    写真

    「第29回 新日本写真全国公募」入選!
  5. プロダクト

    全体を把握できるプロジェクト管理用ノート『yPad2』を3ヶ月くらい使ってみたら…
PAGE TOP