首页 > 代码库 > jQuery学习- 内容选择器

jQuery学习- 内容选择器

2024-08-21 02:20:33   218人阅读

技术分享

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>内容选择器</title>
        <script src=http://www.mamicode.com/"js/jquery.js"></script>
        <script type="text/javascript">
        $(function(){
        //利用:contains获取包含指定文本内容的组件    ,取得包含b的段落
//        $("p:contains(b)").css("border","2px solid red");
        
        //查找拥有子元素为input且类型为text的div对象
//        $("div:has(input[type=‘text‘])").css("border","2px solid orange");
        
        //标出拥有子元素 ，非空元素，利用:parent选择器 获取所有非空元素
//        $("*:parent").css("border","2px solid orange");
        
        //标出所有空元素,利用 :empty
//        $("*:empty").css("border","2px solid blue");
        
        //获取表单下所有输入元素
//        $(":input").css("border","2px solid orange");
        //获取所有按钮
//        $(":button, :submit, :reset").css("border","2px solid orange");
        //利用:disable 获取所有不可用表单元素
        $(":disable").css("border","2px dottle red");
        
        })
        //
        </script>
    </head>
    <body>
        <div>
            <p>
                aaaaaaaaaaaaaaaaaaaaaa
            </p>
            <p>
                bbbbbbbbbbbbbbbbbbbbbb
            </p>
            <p>
                ccccccccccccccccccccccccc
            </p>
        </div>
        <div>
            name:<input type="text" />
        </div>
        <div>
            <input type="button" value=http://www.mamicode.com/"sumbit" />
        </div>
        <div>
            <input type="button" value=http://www.mamicode.com/"ca"  disabled="disabled"/>
        </div>
        <p>
            
        </p>
        <form>
            
            <input type="button" value=http://www.mamicode.com/"formbutton"  disabled="disabled"/>
        </form>
    </body>
</html>

 

jQuery学习- 内容选择器


联系
我们