jQuery----初识jQuery

一、jQuery好处：

①写得少，做的多

②链式编程

③隐式迭代

④解决兼容性问题

 

 

二、顶级对象

Dom中的顶级对象：document------>页面中的顶级对象

document.点出来的是Dom中的属性和方法

Bom中的顶级对象：window-------->浏览器中的顶级对象

window.点出来的是浏览器的属性和方法，window.document也可以点出来，document也属于window

jQuery中的顶级对象：jQuery------>$

$点出来的是jQuery中的方法

 

 

三、加载事件

页面加载事件有如下几种写法：

A.window.οnlοad=function(){ } ------>JS中页面加载事件，只能写一次，如果写多个，后面的会把前面的覆盖

B.$(window).load( function(){ } )------>jQuery页面的加载事件，与A中代码作用相同，可以写多个

上述A和B两种页面加载方式，是页面中所有内容加载完毕后才触发，加载内容指的是：标签、文本内容、图片......等

C.$( document ).ready( function(){ });------>jQuery页面的加载事件

C方法比A和B方法的执行速度快很多，因为C的执行逻辑是把页面的基本标签加载完毕后就可以触发了。

C也可以写作  $( function(){ })

 

 

四、jQuery中引入文件注意问题

先引入文件，然后再使用，开发的时候引入正常的jQuery文件和压缩版的文件都没有问题

建议：开发引入普通版文件，上线后使用压缩版。

 

 

五、jQuery元素与DOM元素的互换

（一）为什么Jquery对象和DOM对象要互转？

　　　　DOM对象转Jquery对象操作方便,毕竟Jquery中方法都是封装好了的,而且兼容问题解决的很好,代码少,方便.

              Jquery对象转DOM对象,因为Jquery中文件一直在更新，很多东西都是随着使用而进行封装和升级,不太可能把所有dom中用到的进行封装,还有很多未知的兼容问题没有封装进去,所以,有的时候jquery中不能解决的问题,还需要原生的js代码来解决,所以,jquery对象有的时候需要转成dom对象来进行。

（二）Jquery对象和DOM对象怎么转换？

dom对象---------->Jquery对象

　　　　　　$(dom对象)

Jquery对象---------->dom对象

　　　　　　$(“#btn“)[0]

　　　　　　$(“#btn“).get(0)

 

六、开关灯示例

示例要求：点击按钮开关，网页实现开灯关灯效果

 1 
 2 
 3     
 4         
 5         
 6         
 7         
22         
23         
24         
25         
40     
41     
42         
43     
44 

 

 

 

转载于:https://www.cnblogs.com/WangYujie1994/p/10271178.html