jQuery相关知识

1.jQuery中$符号有何作用？

   $作为jQuery的别名，如$(document).ready() 即是 jQuery(document).ready()

2.jQuery选择器有哪几种？

   基本选择器：$("#id") —〉通过id获取元素   

                    $(".class") —〉通过既定的类名获取元素

                    $("p") —〉通过名称匹配获取元素

                    $("span,#id,...").css() —〉多个选择合并返回

   层次选择器：$("div span") —〉div中所有的span

                    $("div > span") —〉div下的子元素span

                    $(".red + div") —〉选择class为red的下一个div同辈元素

                    $(".red ~ div") —〉选择class为red的元素后面的所有div同辈元素

   过滤选择器： 基本过滤选择器 { $("div:first") —〉第一个div ; $("div:last") —〉最后一个div ; $("input:not(.red)") —〉选择class不是red的input元素;

                                            $("input:even") —〉index为偶数的input元素; $("input:odd") —〉index为奇数的input元素; $("input:eq(1)"), $("input:gt(1)"),

                                            $("input:lt(1)") 皆是根据index（等于、大于、小于）来选择元素;  $(":header") —〉选取网页中所有 h1 h2 h3 ... ; 

                                            $(":focus") —〉获取当前获得焦点的元素 }

                     内容过滤选择器 { $("div:contains(‘ab‘)") —〉选取含有文本“ab”的div元素; $("div:empty") —〉选择不包含子元素的div空元素;

                                             $("div:has(p)") —〉选择含有p元素的div元素; $("div:parent") —〉选取拥有子元素的div元素 }

                     可见性过滤选择器 { $("input:hidden") —〉选取所有隐藏的input元素; $("div:visible") —〉选取所有可见的div元素 }

                     属性过滤选择器 { $("div[title=‘test‘]") —〉选取title等于“test”的div元素; $("div[id]") —〉选取拥有属性id的元素;

                                             $("div[id=‘id1‘][title=‘test1‘]") —〉多条件复合选择 }

                     表单对象属性过滤 { 如 :selected; enabled; :disabled; :checked; }

3.body中onload()函数和jQuery中的$(document).ready()有什么不同？

   onload()函数是在页面所有资源加载完毕后才开始调用的，只能使用一次；$(document).ready()是在页面加载完DOM后就调用，可以多次使用。

4.将页面所有元素的边框设置为2px宽的虚线？

   $("*").css("border","2px dashed red");    //solid 为实线; dashed 为虚线

5.jQuery中delegate()函数有何作用？

   如果你有一个父元素，需要给其下的子元素添加时间，就可以用到delegate(),代码如下：

   $("u1").delegate("li","click",function(){

           $(this).hide();

   });

6.使用jQuery禁用浏览器的前进后退按钮？

   $(document).ready(function(){

          window.history.forward(1); // or window.history.forward(-1);

  });

7.jQuery选择器和css选择器有何区别？

   jQuery选择器支持css选择器，给对象添加样式和行为；css选择器只能添加样式。

8.jQuery实现table隔行变色？

HTML代码如下：

<table>

<tbody>

<tr class="parent" id="row_01"></tr>

<tr class="child_row_01"></tr>

<tr class="child_row_01"></tr>

<tr class="parent" id="row_02"></tr>

...

</tbody>

$(function(){

    $("tr.parent").click(function(){

          $(this)

          .toggleClass("selected")     //删除或添加高亮

          .siblings("child"+this.id).toggle(); //隐藏或显示子行

    });

});

CSS样式控制隔行变色：

.line{

      table{

         tbody{

             tr:nth-child(odd){background:red;}

             tr:nth-child(even){background:blue;}

         }

      }

}