zoukankan      html  css  js  c++  java
  • [原]强大的JQuery

    JQuery初识

           

           为了简化JS的开发,一些JS库诞生了,JQuery就是其中的一个。JQuery是一个兼容多浏览器的Javascript框架。是轻量级的JS库。jQuery为用户提供了丰富的文档说明,使用户能更方便地处理HTML documents、events、实现动画效果,方便地为网站提供AJAX交互,同时还有许多插件可供选择。

     

    JQuery导图

     

    DOM对象与JQuery对象

             

           DOM(Document Object Model)文档对象模型,每一份DOM都可以表示成一棵树。注意这里特别容易混乱的一个概念JQuery对象。JQuery不是JQuery对象,Jquery对象是通过JQuery包装DOM对象后产生的对象。JQUery对象是JQUery独有的。在JQuery对象中无法使用DOM对象的任何方法。

    JQuery对象:

    var $obj = $("#id");


    DOM对象:

    var domObj = document.getElementById("id"); 


          JQuery对象和DOM对象相互转换。DOM对象才能使用DOM中的方法,不能使用JQuery对象中的方法。

     

    JQuery对象转换成DOM对象:

    var $cr=$("#cr"); //jquery对象 var cr = $cr[0]; //dom对象 也可写成 var cr=$cr.get(0); alert(cr.checked); //检测这个checkbox是否给选中  


     

    DOM对象转换成JQuery对象:

    var cr=document.getElementById("cr"); //dom对象 var $cr = $(cr); //转换成jquery对象  


     

    与Ajax应用

          

            Ajax不需要插件支持,这样可以被绝大多数主浏览器所支持;能在不刷新整个页面的前提下更新数据,使得WEB应用程序能更为迅速地回应用户的操作;Ajax模式通过XMLHttpRequest对象向服务器端提交希望提交的数据,即按需发送;减轻服务器和带宽的负担。

            JQuery对Ajax进行了封装,在JQuery中$.ajax()方法属于最底层的方法,第二层是load() 、$.get()和$.post()方法,第三层是$。getScript和$.getJSON()方法。

            load()方法是JQUery中最为常用的Ajax方法,能载入远程HTML代码并插入到DOM中。代码如下:

     
    $(function(){      $("#send").click(function(){              $("#resText").load("test.html");            }); });


     

     编写插件    

          

          自己对JQuery中插件的初步理解是把JQuery中具有实现相似功能的事件封装起来,优化代码。通过参数的不同把不同的效果显示出来。

      插件的格式与框架:返回一个JQuery对象

    ;(function(){ 
    $.fn.extend({  "color":function(color){return this.css("color",color);//扩展了一个color方法}   }); })();

    注意事项:

    1.所有的对象方法应该附加到jQuery.fn对象上,而全局函数需要附加到jQuery对象上 
    2.在插件内部 this指向的是获取的jQuery对象,而不像一般的方法,指向的是dom元素 
    3.插件内部应避免使用$作为jQuery对象的别名,但可以使用闭包技巧。 

    4.一般情况下,插件应该返回一个jQuery对象,以保证可链式操作。

    总结

           学习需要整理,如果不整理那么学的东西越来越多,就会导致狗熊掰棒子式学习。关于JQuery的学习远远不止这些东西,这些理论上的东西先要学好了,总结了,在应用中发挥更大的作用,将它们发挥的淋漓尽致。学习就是这样,学习——学以致用——学习。

  • 相关阅读:
    监控里的主码流和子码流是什么意思
    监控硬盘容量计算
    一个能让你了解所有函数调用顺序的Android库
    电工选线
    oracle linux dtrace
    list all of the Oracle 12c hidden undocumented parameters
    Oracle Extended Tracing
    window 驱动开发
    win7 x64 dtrace
    How to Use Dtrace Tracing Ruby Executing
  • 原文地址:https://www.cnblogs.com/java20131201/p/3466229.html
Copyright © 2011-2022 走看看