学生プログラマーの落書き @ かずひろかず

ブログを http://d.hatena.ne.jp/kazuhirokazu/ に移転しました。

特集記事、シリーズの最新順の一覧です。この投稿は常に一番上に表示されます。
画像をクリックするとその特集記事の一覧に移動します。

[1回]

http://d.hatena.ne.jp/kazuhirokazu/
完全に移行(したつもりです。)
これからは向こうを主に編集します。

[0回]

このブログは残しておきます。
新しいブログのURLはhttp://d.hatena.ne.jp/kazuhirokazu/となります。

[0回]

要素の属性を書き換えるには、attrメソッドを使います。

要素の属性を書き換える

$("セレクタ名").attr("属性名", "値");

たとえば、これを使ってimgタグのsrc属性を書き換えて画像の切り替えをすることもできます。

サンプルコード:


// idがtargetという要素のsrc属性を書き換える
$("#target").attr("src", "test.jpg");

[0回]

サンプルを見る...

jQueryで要素のサイズを取得したり変更したりするには、 width、heightメソッドを使います。

要素のサイズを取得

$("セレクタ名").width();
$("セレクタ名").height();

要素のサイズを変更

$("セレクタ名").width(幅の値);
$("セレクタ名").height(高さの値);

サンプルコード:

var target = $("#target");

// targetをidに持つ要素の幅、高さを取得する
alert("サイズ: " + target.width() + ", " + target.height());

// 幅、高さを(300, 300)に変更する
target.width(300).height(300);

[0回]

サンプルを見る...

要は前回のやつです。
cssメソッドを使うと、簡単にスタイルを書き換えることができます。
しかし、jQueryの便利なところはそこだけではありません。jQueryはメソッドチェーンという手法を使えます。

メソッドチェーンとは、名前の通り次から次へとメソッドを連結させて記述することができます。CSSの記述も、メソッドチェーンを使えば一気に書くことができるのです。

指定した要素のスタイルを書き換える

$("セレクタ名")
.css("プロパティ", "値")
.css("プロパティ", "値")
.css ....
.css("プロパティ", "値");

サンプルコード:

// targetというidを持つ要素のスタイルを変更
$("#target").css("font-weight", "bold") // 太字 font-weight: bold
            .css("font-size", "large") // 文字サイズ大 font-size: large
            .css("color", "red"); // 文字色赤 color: red

[0回]

サンプルを見る...

jQueryを使うと、こんなことも簡単にできちゃいます。

指定した要素の背景色を変更する

$("セレクタ名").css("background-color", "背景色");

これはcssメソッドを利用して、セレクタによって指定された要素のスタイルを書き換えています。

サンプルコード:

// targetというidをもつ要素の背景色を青へ変更する
$("#target").css("background-color", "blue");

[0回]

サンプルを見る...

これは非常に簡単です。
まず、公式サイト(http://jquery.com/)から最新のjQueryのソースをダウンロードします。
そしてそれをサイトのディレクトリに配置し、scriptタグでsrc属性にjQueryのjsのパスを指定すれば、jQueryを使えるようになります。

<script type="text/javascript" language="javascript" src="[jQueryのパス].js"></script>

簡単にjQueryを導入することができましたね。

[0回]

JavaScriptを理解している人向け jQuery 1.6 のTips

[0回]

linux-lowlatencyカーネルを導入した際に、デスクトップが表示されず、コンソールのまま (= Xが起動しない)という問題が発生したのでメモ。
低レイテンシカーネルを導入した理由は特にありません。低レイテンシ、リアルタイムカーネルっていう響きに惹かれただけです(笑)

続きは[続きを読む...]から。

[1回]