JQuery(4)——JQuery选择器

1、JQuery选择器用于查找满足条件的元素，比如可以用$("#控件Id")来根据控件id获得控件的jQuery对象，相当于getElementById：

$(“#div1”).html(“<font color=red>hello</font>”)

语法、意义类似于CSS选择器。

 

2、$就是函数。

3、$("TagName")来获取所有指定标签名的jQuery对象，相当于getElementsByTagName：

        $(function() {
            $("#btnClick").click(function() {
                $("p").html("我们都是P");
            });
        });

匿名函数的写法如果嵌套层数过多，可以将匿名函数写到单独的一个匿名函数然后用变量指向它，但是不推荐直接写一个命名函数再传进去。

 

4、JQuery中注册事件监听的写法：click()、leave()、focus()、blur...，自己动手写click函数。

 

5、CSS选择器，同时选择拥有样式的多个元素（类似于CSS选择器）：

    <style type="text/css">
        .test{ background-color:Red}
    </style>
    <script type="text/javascript">
        $(function() {
        $(".test").click(function() {
                alert($(this).text());
            });
        });
    </script>   
    <p class="test">test1</p>
    <p class="test">test2</p>
    <p class="test">test3</p>

 

6、标签选择器，拥有样式的标签选择器。

7、多条件选择器：$("p,div,span.menuitem")，同时选择p标签、div标签和拥有menuitem样式的span标签元素（类似于CSS选择器）。

8、注意选择器表达式中的空格不能多不能少。易错！

 

9、层次选择器：

（1）$("div li")获取div下的所有li元素（后代，子、子的子……）。

（2）$("div > li")获取div下的直接li子元素。

（3）$(".menuitem + div")获取样式名为menuitem之后的第一个div元素（不常用）。

（4）$(".menuitem ~ div")获取样式名为menuitem之后所有的div元素（不常用）。