zoukankan      html  css  js  c++  java
  • JQ基本

        jQuery的入口函数:

        特点:1. 等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完毕,jQuery帮我们完成了封装。

            2. 相当于原生js中的DOMContentLoaded。

            3. 不同于原生js中的load事件是等页面文档、外部的js文件,css文件,图片加载完毕才执行内部代码。

        方式一:

          $(document).ready(function(){

            . . .  //此处是页面DOM加载完成的入口

          });

        方式二:

          $(function(){

            . . .  //此处是页面DOM加载完成的入口

          });

        版本:1x:兼容 IE 6 7 8 等低版本浏览器

            2x:不兼容 IE 6 7 8 等低版本浏览器

           3x: 不兼容 IE 6 7 8 等低版本浏览器 ,官网主要更新维护的版本

        文档下载官方地址:https://jquery.com

        其他版本下载地址:htts://code.jquery.com 

         

          jQuery插件常用的网站:

          1.jQuery插件库:http://www.jq22.com

          2.jQuery之家:http://www.htmleaf.com

           

        $ 是 jQuery的顶级对象,相当于原生JavaScript中的window,把元素利用 $ 包装成jQuery对象,就可以调用jQuery的方法。

          $( 'div' ). hide( );   // 把元素div,使用 $ 符号包装成jQuery对象,调用 hide 方法

     

        JQuery对象和DOM对象的区别:

         1. jQuery 对象:

           jQuery方法获取的元素就是jQuery对象,本质是:利用 $ 对DOM 对象包装后产生的对象(伪数组形式存储)

           $(' div ');

          2. DOM对象:

           用原生 JS 获取来的对象就是DOM对象

           var myDiv = document.querySelector( 'div' );

             3. 两个对象并不一样,jQuery 对象只能使用jQuery的方法,DOM对象只能使用原生的JavaScript属性和方法。

          1.jQuery多库共存:

          问题概述:jQuery使用$作为标示符,随着jQuery的流行,其他js库也会用这$符号作为标识符,这样一起使用会引起冲突

           $(function(){

              function   $(ele){

                return document . querySelector(ele);

              }

              console . log($("div"));

           })

            1.如果 $ 符号冲突,我们就是用 jQuery

              jQuery . each( ) ;

            2.让 JQuery 释放对 $ 控制权 让用什么自己决定 

             var  zidingyi   = jQuery.noConflict( );

             console . log( zidingyi ("span"));

            zidingyi.each();

           2.图片懒加载插件:(图片使用延迟加载,可提高网页下载速度,他也能帮助减轻服务器负载)

             当我们页面滑动到可视区域,再显示图片

             我们使用jquery插件库 EasyLazyload。注意,此时的 js 引入文件和 js 调用必须写到DOM元素(图片)的最后面

           3.全屏滚动插件(fullpage.js)

              gitHub : https//github.com/alvarotrigo/fullPage.js

              中文翻译网站: http://www.dowebok.com/demo/2014/77/

             

  • 相关阅读:
    如何处理iOS中照片的方向
    Builder Pattern 在 Objective-C 中的使用
    多线程(三)-- 线程安全问题
    多线程(二)--NSThread基本使用
    多线程 (一)
    报错:Request failed: unacceptable content-type: text/html
    Cocoapods简单安装和使用
    Objective
    Objective
    Python学习笔记(一)--注释
  • 原文地址:https://www.cnblogs.com/qtbb/p/11289932.html
Copyright © 2011-2022 走看看