hiramatch's blog

iOSアプリ開発に目覚め、毎日勉強の日々です。

jQueryの属性セレクタ

今日もドットインストールコムでjQueryの勉強をしました。
今日のテーマは属性セレクタといわれるもので
「要素のxxxx属性がyyyyのもの」など属性で対象を指定するセレクタになります。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>属性セレクタ addClass</title>
</head>
<body>
    <Style>
        .myClass {
            font-size:20px;
            background: silver;
        }
    </Style>
    <p><a href="http://yahoo.co.jp">yahoo</a></p>
    <p><a href="http://google.com">google</a></p>
    <p><a href="http://dotinstall.com">dotinstall</a></p>
    <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
    <script>

    $(function(){
        // yahooだけ対象
        // $('a[href="http://yahoo.co.jp"]').css('color','red');
        // yahoo以外対象
        // $('a[href!="http://yahoo.co.jp"]').css('color','red');
        // href属性に「dot」を含んでいるものが対象
        //$('a[href*=dot]').css('color','orange');
        // p要素にクラス属性を付加する
        $('p').addClass('myClass');

    })
    </script>
</body>
<html>

以下がaddClassメソッドの実行結果です。
f:id:hiramatch:20151201234305p:plain