jQuery:HTMLへのアクセス

jQueryを扱えるようになりたい!!ということで、早速基本部分から。

尚、JavaScriptは全くいじった事がありません・・・

資料を購入する余裕も今はないので、こちらを参考に基本から。

まずは、動作対象となるhtmlタグを指定する方法。
感覚的にはほぼCSSと同じ。楽チン。

■ドキュメントへのアクセス(CSSライク)

  • 特定タグへのアクセス
    pタグへのアクセスは、$(“p”)
  • 複数タグへのアクセス
    CSSと同様にカンマ区切りでアクセス。$(“p,img,div”)
  • id=”about”へのアクセス
    $(“#about”)
  • class=”about”へのアクセス
    $(“.about”)

以上は、CSSのセレクタ指定を$(“”)の中に入れ込めば良いので問題なし。
ただし、以下の部分からアクセスの方法が異なる。

■ドキュメントへのアクセス(階層構造的に)
※参考として以下のcodeの結果を考える

<p><span>text1</span><span>text2<span>text3</span></span>text4</p>
  • pタグの中のspanタグへのアクセス$::text1text2text3
    (“p span”)
  • pタグの中の子spanタグへのアクセス::text1text2
    $(“p>span”)
  • pタグの直後のspanタグへのアクセス::text1
    $(“p+span”)

より詳細にアクセスする場合には便利ですね。なるほど。

■関連メソッド
※参考として以下のcodeの結果を考える

<b>1と2</b>の違い
  1. html(“”)
    対象とするアクセスにhtml形式で文字列を出力

    1と2の違い
  2. text(“”)
    対象とするアクセスにtextそのままの文字列を出力

    <b>1と2</b>の違い

今回はHTMLへのアクセスでしたが、CSSにもアクセスできる!!ということで。
CSSにアクセスできるのは凄いな(汗

明日はCSSとイベントについてまとめたいと思います。

コメントを残す

メールアドレスが公開されることはありません。