jQuery零基础详细教程

2019/6/3再学jQuery,之前学的都忘记了,现在再次捡了起来,决定边学边记录,直到我学完为止

jQuery 是一个 JavaScript 库。

jQuery 极大地简化了 JavaScript 编程。

jQuery 很容易学习。

直接在jQuery官网下载jQuery库

http://jquery.com/

jquery-1.12.4.min.js:压缩版本,适用于生产环境,因为文件比较小,去除了注释、换行、空格等东西,但是基本没有颗阅读性。
jquery-1.12.4.js:未压缩版本,适用于学习与开发环境,源码清晰,易阅读。

1.x版本:能够兼容IE678浏览器
2.x版本:不兼容IE678浏览器
1.x和2.x版本jquery都不再更新版本了,现在只更新3.x版本。
3.x版本:不兼容IE678,更加的精简(在国内不流行,因为国内使用jQuery的主要目的就是兼容IE678)

使用jQuery的三个步骤:

1. 引入jQuery文件
2. 入口函数
3. 功能实现

关于jQuery的入口函数:

<script>
// 1.第一种写法
$(document).ready(function () {
// alert("hello lnj");
});

// 2.第二种写法
jQuery(document).ready(function () {
// alert("hello lnj");
});

// 3.第三种写法(推荐)
$(function () {
// alert("hello lnj");
});

// 4.第四种写法
jQuery(function () {
alert("hello lnj");
});
</script>

jQuery入口函数与js入口函数的对比

1.	JavaScript的入口函数要等到页面中所有资源(包括图片、文件)加载完成才开始执行。
2.	jQuery的入口函数只会等待文档树加载完成就开始执行,并不会等待图片、文件的加载。  

解决jQuery冲突问题

 // 1.释放$的使用权
        // 注意点: 释放操作必须在编写其它jQuery代码之前编写
        // 释放之后就不能再使用$,改为使用jQuery
        // jQuery原理.noConflict();
        // 2.自定义一个访问符号
        var nj = jQuery.noConflict();
        nj(function () {
            alert("hello lnj");
        });

 基本选择器

静态方法和实例方法,静态方法通过类名调用,实例方法通过类的实例调用
<script>
        // 1.定义一个类
        function AClass() {
        }
        // 2.给这个类添加一个静态方法
        // 直接添加给类的就是静态方法
        AClass.staticMethod = function () {
            alert("staticMethod");
        }
        // 静态方法通过类名调用
        AClass.staticMethod();

        // 3.给这个类添加一个实例方法
        AClass.prototype.instanceMethod = function () {
            alert("instanceMethod");
        }
        // 实例方法通过类的实例调用
        // 创建一个实例(创建一个对象)
        var a = new AClass();
        // 通过实例调用实例方法
        a.instanceMethod();
    </script>

  

 

posted @ 2019-06-03 18:24  showTimehzy  阅读(714)  评论(0编辑  收藏  举报