jqery基础知识

选择器按属性，子元素，表单匹配元素
<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>属性 子元素 表单</title>

<style type="text/css">

</style>

<script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script>

<script type="text/javascript">

    $(function(){

        //属性

        $("input[name]").css('border-color','red');//具有name属性的input标签

        $("input[name='zhanghao']").css('height','20px');//匹配指定name属性值的input标签

        $("input[name!='zhanghao']").css('height','20px');//匹配name属性不是指定值的input标签

        $("input[name^=zh]")//匹配name值以zh开头的input标签

        $("input[name$=ma]")//匹配name值以ma结尾的input标签

        $("input[name*=m]")//匹配name值含有m的input标签

        // $("input[][][]")[]可以有一个属性选择一共可以有多个选择

        //子元素

        $("form input:nth-child(1)").css('font-size','20px');//查找所有form的第一个input字标签nth-child()角标从1开始

        $("form input:first-child")//查找每一个form的第一个input标签

        $("form input:last-child")//查找每一个form的最后一个input标签

        $("form input:only-child")//查找所有form标签只有唯一子元素的input标签

        //表单

        $(':input')//匹配所有的input textarea select button元素

        $(':text')//匹配所有文本框

        $(':password')//匹配所有密码框

        $(':radio')//匹配所有单选按钮

        $(':checkbox')//匹配所有复选框

        $(':submit')//匹配所有提交按钮

        $(':image')//匹配所有图像域

        $(':reset')//匹配所有重置按钮

        $(':button')//匹配所有按钮

        $(':file')//匹配所有文本域

        $(':hidden')//匹配所有不可见元素

        $(':enabled')//匹配所有可用元素

        $(':disabled')//匹配所有不可用元素

        $(':checked')//匹配所有被选中的元素

        $('selected')//匹配所有选中的option元素

    })

</script>

</head>

<body>

    <form>

        帐号：<input type="text" name="zhanghao"><br/>

        密码：<input type="password" name="mima"><br/>

        <input type="button" value="完成">

    </form>

</body>

</html>
巴特西

jqery基础知识

最新文章

热门文章
