1.4. jQuery的版本

官网下载地址:http://jquery.com/download/ jQuery版本有很多,分为1.x 2.x 3.x

大版本分类:

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

关于压缩版和未压缩版

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

1.5. jQuery的入口函数

使用jQuery的三个步骤:

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

关于jQuery的入口函数:

//第一种写法
$(document).ready(function() { });
//第二种写法
$(function() { });

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

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

1.6. jQuery对象与DOM对象的区别(重点)

1. DOM对象:使用JavaScript中的方法获取页面中的元素返回的对象就是dom对象。
2. jQuery对象:jquery对象就是使用jquery的方法获取页面中的元素返回的对象就是jQuery对象。
3. jQuery对象其实就是DOM对象的包装集(包装了DOM对象的集合(伪数组))
4. DOM对象与jQuery对象的方法不能混用。

DOM对象转换成jQuery对象:【联想记忆:花钱】

var $obj = $(domObj);
// $(document).ready(function(){});就是典型的DOM对象转jQuery对象

jQuery对象转换成DOM对象:

var $li = $(“li”);
//第一种方法(推荐使用) 下标
$li[0]
//第二种方法 get方法
$li.get(0)

【练习:隔行变色案例.html】

《jQuery精品教程视频\jQuery精品教程资料\19-jQuery第一天\04-代码\05-DOM对象(js对象)与jq对象.html》

<script>

  $(function () {

    //1. 什么是DOM对象(js对象):使用js的方式获取到的元素就是js对象(DOM对象)
//var cloth = document.getElementById("cloth");
//cloth.style.backgroundColor = "pink"; //2. 什么是jq对象:使用jq的方式获取到的元素就是jq对象
//var $li = $("li");
//console.log($li);
//$li.text("我改了内容"); //3. jq对象与js对象的区别
//js对象对象不能调用jq对象的方法
//var cloth = document.getElementById("cloth");
//cloth.text("呵呵"); //4. jq对象与js对象的联系(jq对象其实就是js对象的一个集合,伪数组,里面存放了一大堆的js对象)(宏观上) //jquery对象能不能调用DOM对象的方法
//var $li = $("li");
//$li[0].setAttribute("name","hehe"); //DOM无法调用jQuery对象的方法:为什么:因为是两个不同对象
//DOM对象调用jQuery对象的方法。需要把DOM对象转换成jQuery对象。
var cloth = document.getElementById("cloth"); //DOM对象就变成jQuery对象
//$(cloth).text("呵呵"); //jQuery对象怎么转换成DOM对象(取出来)
var $li = $("li");
$li[1].style.backgroundColor = "red";
$li.get(2).style.backgroundColor = "yellow"; //1. 什么是DOM对象:用js的方式获取到的对象时DOM对象
//2. jQuery对象:用jq的方式获取到的对象时jq对象
//3. 区别与联系
//4. 区别:js对象与jq对象的方法不能混着用
//5. 联系:
// DOM--> jQuery $()
// jQuery--》 DOM $li[0] $li.get(0)
});

2、jQuery的基本概念-必看-版本-入口函数- jq对象和dom对象区别的更多相关文章

  1. 【二】jquery之基础概念与jquery对象与dom对象的区别及混合使用

    一:jquery基本概念 1.jquery是一个javascript框架,它是一个轻量级的js库 2.当下流行的js库有: jquery MooTools Prototype 3.$(ducoment ...

  2. 判断一个对象是jQuery对象还是DOM对象

    今天调试一段代码的时候,看到其中一个变量,想知道它到底是jquery对象还是dom对象. 虽然直接console出这个对象,看它的内部可以判断出来.但是我想有没有什么更方便的方法呢. 后来我想到了一个 ...

  3. 什么是jquery $ jQuery对象和DOM对象 和一些选择器

    1什么是jQuery: jQuery就是将一些方法封装在一个js文件中.就是个js库 我们学习这些方法. 2为什么要学习jQuery: 原生js有以下问题: 1.兼容性问题2.代码重复3.DOM提供的 ...

  4. jQuery对象与dom对象的转换

    一直以来对于通过jQuery方式获取的对象使不能直接使用JavaScript的一些方法的,开始的时候不理解,现在此案知道,原来jQuery获得的对象并不和我们平时使用getElementById获得的 ...

  5. jQuery编程基础精华01(jQuery简介,顶级对象$,jQuery对象、Dom对象,链式编程,选择器)

    jQuery简介 什么是jQuery? jQuery就是一个JavaScript函数库,没什么特别的.(开源)联想SQLHelper类 jQuery能做什么?jQuery是做什么的? jQuery本身 ...

  6. jQuery对象和dom对象的辨析和相互转化

    jquery对象和dom对象总是让人感觉很难分清,其实只要做到1对两者概念有明确认识2找出不同点 A DOM 1概念 DOM对象(Document Object Model,文档对象模型)可以把htm ...

  7. 转:jQuery对象与dom对象的转换

    jQuery对象与dom对象的转换 发布时间:September 20, 2007 分类:JavaScript <新站上线的手记> <Discuz!多附件上传选择框之jQuery版& ...

  8. JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)

    一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...

  9. JS对象与Dom对象与jQuery对象之间的区别

    前言 通过问题看本质: 举例: js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样写的 $("#save&qu ...

随机推荐

  1. C++ template一些体悟(2)

    class template的一般化设计之外,特别针对某些参数做特殊设计 #include <iostream> using namespace std; //一般设计 template& ...

  2. appium在不同类中使用的是同一个session

    要这么做的起因: 测试testng框架的时候,不同类之间可以按照顺序执行,不会互相干扰.但是换成了appium,在A类中启动了session,初始化或者一些数据我仍然要用之前的session,那就不行 ...

  3. qml性能优化(来源于群友分享);

    Qt quick性能优化 使用时间驱动 避免定时轮询: 使用信号槽形式: 使用多线程 C++; QML WorkerScript元件: 使用Qt Quick Compiler 只需要再PRO文件中添加 ...

  4. PV、UV、UIP、VV、CPC、CPM、RPM、CTR解释

    PV.UV.UIP.VV.CPC.CPM.RPM.CTR 具体解释 PV:Page View,页面访问量,也就是曝光量. UV:Unique Visitor,独立访客数,同一个访问多次访问也只算1个访 ...

  5. 为SNP增加种族人群频率

    一.Ensemble:http://www.ensembl.info/2015/06/18/1000-genomes-phase-3-frequencies-genotypes-and-ld-data ...

  6. java io系列05之 ObjectInputStream 和 ObjectOutputStream

    本章,我们学习ObjectInputStream 和 ObjectOutputStream ObjectInputStream 和 ObjectOutputStream 介绍 ObjectInputS ...

  7. java io系列10之 FilterInputStream

    FilterInputStream 介绍 FilterInputStream 的作用是用来“封装其它的输入流,并为它们提供额外的功能”.它的常用的子类有BufferedInputStream和Data ...

  8. 5.原型模式(Prototype)

    依赖关系倒置: 动机(Motivate):    在软件系统中,经常面临着“某些结构复杂的对象”的创建工作;由于需求的变化,这些对象经常面临着剧烈的变化,但是它们却拥有比较稳定一致的接口.    如何 ...

  9. linux备份用户权限

    1:切换root用户,进入home目录,执行以下命令: [root@localhost home]# ll /home/wangfajun 2: home目录下执行以下命令进行wangfajun用户的 ...

  10. Hadoop记录-安装ambari hdp集群

    #!/bin/sh #配置用户sudo权限(参考/etc/sudoers文件,在/etc/sudoers.d/新建一个用户配置文件,注意要注销) #需要在/etc/sudoers末尾追加:sfapp ...