jQuery_2_常规选择器-高级选择器2

属性选择器

    <a title="num1">num1</a>
    <a title="num-ad">num2</a>
    <a title="ahd ashdu shdu">num3</a>
    <a title="no4">num4</a>
    <a href="" title="num5">num5</a>

$(function () {
    $("a[title]").css("color", "red");  //包含title属性的a元素
    $("a[title=num1]").css("color", "red");//title=num1的a元素
    $("a[title^=num]").css("color", "red");//属性title以num开头的a元素
    $("a[title$=4]").css("color", "red")//属性title以4结尾的a元素
    $("a[title|=num1]").css("color", "red")//title=num1或者title以num-开头
    $("a[title|=num]").css("color", "red")
    $("a[title!=num1]").css("color", "red");//属性title值不等于num1的a元素
    $("a[title~=shdu]").css("color", "red");//空格分开的
    $("a[title*=num]").css("color", "red");//属性title值包含num的a元素
    $("a[href][title=num5]").css("color", "red");//多属性匹配
})

 

a[title]{
    color:red;
}

a[title=num1]{
    color:red;
}

a[title^=num]
{
    color:red;
}

a[title$="4"]{
    color:red;
}

a[title|=num]
{
     color:red;
}

a[title!=num1]  没有！=
{
    color:red;
}

a[title~=shdu]{
    color:red;
}

a[title*=num]{
    color:red;
}

 a[href][title=num5]{
    color:red;
}