jquery学习--与DOM,选择器

 DOM与jquery

    innerHTML--html()

        document.getElementById("foo").innerHTML-------------$("#foo").html()

    DOM对象与jquery对象

       var variable(DOM对象)--------------var  $variable(jquery对象)  区别就是jquery需要在变量前加一个“$”符号

    DOM对象转换成jquery对象

       方法：[index]          如：var   cr=$cr[0];---------$cr为jquery对象  

    jquery对象转换成DOM对象

      方法：$(DOM)        如：var   $cr= $(cr);--------cr为DOM对象

jquery的根基：选择器

    CSS选择器

    jquery选择器函数$()

         避免错误机制：当所选择的对象元素不存在时，也不会报错，传统的会报错（getElementById("#tt")）

             不能用来判断该元素是否存在

                 获取元素的长度来判断  if($("#tt").length>0){------}

                 转换为DOM对象来判断 if($("#tt")[0]){-------}

         基本选择器

             通过元素id、class和标签名来查找DOM元素，如 $("#id")，$(".class")，$("p")，$("div ,span,p")

        层次选择器

             通过DOM元素之间的层次关系来获取的有后代元素、子元素、相邻元素、同辈元素

                 后代元素：$("ancestor descendant")    选取ancenster里的所有descendant(后代)元素

                 子元素   ：$("parent>children")             选取parent下的子元素children

                 相邻元素：$(""prev+next"")                   选取紧接在pre元素之后的next元素

                 同辈元素：$("prev~siblings")                选取pre 元素之后的所有siblings元素

           $("prev+next")-----------------next()

           $("pre~siblings")-------------nextAll()---------------siblings()

      过滤选择器

            与CSS伪类选择器类似，都是以：开头

            基本过滤选择器：

                 :first：选取第一个元素        

                 :last：选取最后一个元素

                 :not(selector)：去除所有与给定选择器匹配的元素  ，如$("input:not(.myclass)")

                 :even：选取索引是偶数的所有元素，如$("input:even")

                 :odd：选取索引是奇数的所有元素，如$("input:odd")

                 :eq(index)：选取索引等于index的元素

                 :gt(index)：选取索引大于index的所有元素

                 :lt(index)：选取索引小于index的所有元素

            内容过滤选择器

                体现在所包含的子元素或文本内容上

                :contains(text)：选取含有文本内容为“text”的元素 ，如$("div:contains('我')")

                :empty：选取不包含子元素或文本内容的空元素

                :has(selector)：选取含有选择器匹配的元素的元素

                :parent：选取含有子元素或者文本的元素

          可见性过滤选择器

               :hidden：选取所有不可见的元素

               :visible：选取所有可见的元素

          属性过滤选择器

               [attribute]：选取拥有此属性的元素，如$(div[id])

               [attribute=value]：选取属性的值为value的元素，如$div(title=test)

         子元素过滤选择器

              :nth-child[index/odd/even] ：选取每个父元素下的第index个子元素或者奇偶元素（index从1开始）

              :first-child：选取每个父元素下的第一个子元素

              :last-child：选取每个父元素下的最后一个元素

         表单对象属性过滤选择器

             :enabled：选取所有可用元素

             :disabled：选取所有不可用元素

             :checked：选取所有被选中的元素，单选框，文本框，$(input:checked)

             :selected：选取所有被选中的选项元素，如$("select option:selected")

        表单选择器