Jquery浅谈之讲解一

               对于web developement,我想说说我对于Jquery知识的了解和总结。希望对大家有帮助,同时也欢迎大家的评论

       

              简介:jquery是由美国人John Resig创建,  jquery的宗旨是:writer less,do more   对于关于jquery的其它信息可以再www.jquery.com中了解

   jquery是基于javascript查询库,  当然如果你认为它仅仅能做这种事情的话,那你也就太小看它了,我们通过jquery可以完成许多html的动态效果,能过轻松的进行ajax请求等

            

            历史:jquery是 继承prototype之后的又一个优秀的javascript框架 轻量级的js库,拥有强大的兼容性,对于css和大部分浏览器都是兼容的,在页面处理方面,jquery能过

更方便的处理html,document,events,实现动态效果,并可以提供方便的ajax交互,jquery能过很好的使得html代码分离,从而避免在html中嵌入js的调用

 

           javacript中的五种基本数据类型:undefined,null,boolean,string,number

  

         基本的jquery用法:

                      typeOf ()   验证关键字类型的返回

                      $(document).ready(function(){

                                 //这里是jquery的基本,当html的Dom元素加载完毕,但是它们之间的相关联关系并没有完成时执行

                       });

                      $("a").click(function(){

                               //当html元素a被触发click事件的时候执行

                     });

                     $("#sharmeId").click(function(){

                             //当html元素Id名为sharmeId的元素被触发click事件的时候执行

                      });

                     //添加子元素      ,在这里注意jquery中html()这个函数有两个作用,没有没有放参数体,那么就是获取html()内容,如果放了那么就是设置内容,这里是设置Id为sharmeId的内容

                      $("#sharmeId").html("

                               <font color='red'>sharme Yao</font>

                        ");

                       

            选择器的使用:

                         jquery的每一个对象都有length的属性

                         在这里想和大家说说在html中onload()函数和jquery中ready()函数的区别:

                                前者表示是html中整个DOM元素都加载完毕,并且他们之间的相关联的关系也已经完成之后执行,而后者是整个DOM元素加载完毕,但是他们之间的相关联的关系并没有加载完毕的时候就已经执行

 

  以下是我对于jquery中的选择器做了一些筛选之后的内容,希望对于大家使用

            基本选择器:

                      $("#id") 根据Id找对应的元素,如果不存在返回一个空的jquery对象

                      $(".class")  更加css的class属性找对应的元素,返回集合对象

                      $("p ")     选取所有的P标签的元素

                      $(" * ")     找寻所有元素,返回所有元素

                     $("div,span,p")   将每一个选择器合并在一起之后返回

         层次选择器:

                     $("body div").css("background","red"); 将body一下的所有div元素的背景颜色改变

                     $("body > div").css("background","red");将body的直接子元素的背景颜色改变

                     $(",one+next").css(....);   将class为one的下一个元素的样式进行操作

                     $("#one ~ div")   获取ID为one的,后面所有的兄弟元素的集合

                     $("#one").next("div").css() ;  寻找到ID为one,下一个div元素对象

                     $("#one").nextAll("div").css();  寻找ID为one元素之后的所有div元素对象

                     $("#one").siblings("div").css()    寻找ID为one的所有的div的兄弟元素

 

         由于时间的原因,下次将和大家更深入的了解选择器和jquery的动画,如果有哪些不好的地方希望大家提出来,谢谢

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章