返回jquery选......登陆

jquery选择器

温度。2019-04-22 11:22:20229
<div class="box">
    <p>1</p>
    <p>1</p>
    <p id="num">1</p>
    <div><p>2</p></div>
    <p><span>11</span></p>
    <p>temp</p>
    <div></div>
    <div><b></b></div>
    <button id="btn">点击 </button>
</div>
<script>
//父级元素下匹配所有子元素   $('父级元素 > 子级元素')
        //$('.box > p').css('color','red');        //祖先元素下匹配所有后代元素   $('祖先元素 > 后代元素')
        //$('.box p').css('fontSize','26px');        //匹配紧跟在p元素后面的next元素   $('p + next')两个必须是同级元素
        //$('p+input').css('background','red');        //匹配p元素后面所有siblings同级元素   $('p ~ input')
        //$('p~input').css('background','blue');        
        //prev() 匹配同级元素紧邻的前面的元素
        //$('#num').prev();        // :first  匹配第一个元素
        //$('.box p:first').css('color','green');        // :last  匹配最后一个元素
        //$('.box p:last').css({'color':'orange','fontSize':'50px'});        //比较 
        //$('p:gt(1)').css('color','green'); //匹配大于x的元素,从0开始
        //$('p:lt(1)').css('color','green'); //匹配小于x的元素,从0开始
        //$('p:eq(1)').css('color','green'); //匹配等于x的元素,从0开始

        //奇偶数
        //$('p:odd').css('color','red'); //匹配奇数行的元素,从0开始
        //$('p:even').css('color','red'); //匹配偶数行的元素,从0开始

        //非
        //$('p:not(#num)').css('background','red');  //匹配除了id为num的所有p标签

        //内容选择器
        //$('p:contains(temp)').css('background','pink'); //匹配包含指定文本的元素
        //$('p:has(span)').css('color','green');  //匹配包含特定选择器的元素
        //$('div:empty').css('background','red');//匹配不含有内容的空元素,什么都没有
        //$('div:parent').css('background','green');  //匹配含有了元素或者文本的元素 和:empty相反


        //表单选择器
        // 语法:
        // $(':enabled')所有激活的input元素(可以使用的input元素)
        // $(':disabled')所有禁用的input元素(不可以使用的input元素)
        // $(':selected')所有被选取的元素,针对于select元素
        // $(':checked')所有被选中的input元素
</script>


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送