jQuery选择器基本选择器

Posted 2020-11-03

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery选择器基本选择器相关的知识，希望对你有一定的参考价值。

form input：查询form下所有input元素，含有后代关系
form>input：查询form下所有input元素，有有父子关系，没有后代关系
form+input：查询与form同级的第一个input元素，是兄弟关系
form~input：查询与form同级的所有input元素，是兄弟关系

<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript" src="../js/jquery-1.6.js"></script>
  </head>
  <body>
    <form>
        <input type="text" value="a"/>      
        <table>
            <tr>
                <td>
                    <input type="checkbox" value="b"/>
                </td>
            </tr>           
        </table>
    </form>
    <input type="radio" value="c"/>
    <input type="radio" value="d"/>
    <input type="radio" value="e"/>
    <script type="text/javascript">

        //1)找到表单form下所有的input元素的个数
        //alert($("form input").size());

        //2)找到表单form下所有的子级input元素个数
        //alert($("form>input").size());

        //3)找到表单form同级第一个input元素的value属性值
        //alert($("form+input").val());

        //4)找到所有与表单form同级的input元素个数
        alert($("form~input").size());

    </script>
  </body>
</html>

以上是关于jQuery选择器基本选择器的主要内容，如果未能解决你的问题，请参考以下文章