zoukankan      html  css  js  c++  java
  • jQuery 基础理论

    jQuery: 第三方开发的执行DOM操作的极简化的函数库

    解决了大部分浏览器兼容性问题,凡是jQuery让用的几乎都没有兼容性问题

     但是:

       仅限于PC

       仅是对DOM的每一步进行了简化但是没有从根本上简化步骤

    1 使用:

      (1)本地引入:<script src="js/jquery.minl.js"></script>

      (2)CDN方式引入:如

    <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
      crossorigin="anonymous">
    </script>

    2. jQuery的原理:

    (1)引入jquery.js其实是向全局window中添加了一种新的类型: jQuery

      ① 构造函数:负责创建jQuery类型的子对象

        内容其实就是:function jQuery(){ return new jQuery... }

         如此一来,今后创建jQuery的子对象时,就不用再写new,而是直接写jQuery(),且jQuery做了进一步的简化:让$=jQuery,所以,调用$()等同于调  用jQuery().

      具体$()做2件事:

        1)创建一个jQuery的子对象;

        2)去DOM树上查找要操作的元素,保存进jQuery子对象中;

       

      ② 原型对象:jQuery的原型对象jQuery.prototype负责保存所有jQuery类型的子对象共有的方法

    所以:

      (1)要用jQuery的简化版函数来操作DOM元素,都必须先创建jQuery的子对象,并且封装到jQuery对象中,才能使用jQuery的简化函数。

      (2)但是调用jQuery家的简化版函数底层会被自动翻译为原生的DOM函数或属性作用于jQuery对象中封装的DOM元素身上。

      (3)jQuery子对象调用简化版函数就等效于从前对原生DOM元素调用原生的DOM函数和属性

    3.如何使用jQuery:

    就像上面说的,jQuery操作DOM元素的步骤其实并没有简化,和DOM操作页面元素的步骤基本一样:

    (1)查找触发事件的元素: 

    var $变量名=$("选择器")

     (2)绑定事件处理函数:

    $变量名.click(function(){
        //获得this: this->当前点击的DOM元素对象,千万别看.前!
        //但是this指向的是DOM元素,无权使用jQuery家的函数
        //所以,将来this->  var $变量=$(this);
        (3). 查找要修改的元素: 也可用$("选择器")
        (4). 修改元素:
        a. 修改元素的内容: $元素.html("新内容")
    })

     4.jQuery简化版函数的特点:

    (1)所有和修改相关的函数一个函数两用。如html(),text()都可以设置或者获取值,不写参数时就是获取值。

    (2)几乎所有jQuery函数都内部自带for循环。

        因为jQuery查找的结果是一个类型数组对象。对整个类数组对象调用一个jQuery简化版函数,其内部都自带for循环,会将效果自动应用到查找结果中  每个DOM元素上

    如:

     (3)大部分jquery函数都会将正在操作的.前的jQuery对象,再次返回出来,供后续操作继续使用——链式操作

  • 相关阅读:
    将Apache2.4手动安装成Windows的服务
    [译文]PHP千年虫(y2k compliance)
    Apache2.4 authz_core_module模块使用
    Cannot start session without errors, please check errors given in your PHP and/or webserver log file and configure your PHP installation properly.错误
    [转载]开启debug调试模式
    thinkphp 去掉URL 里面的index.php
    在WINDOWS下安装PEAR
    php5.5.15注释问题PHP Deprecated: Comments starting with '#' are deprecated in *.ini 警告解决办法
    Maven 与 IntelliJ IDEA 的完美结合
    JavaRebel 2.0 发布,一个JVM插件
  • 原文地址:https://www.cnblogs.com/codexlx/p/12519941.html
Copyright © 2011-2022 走看看