前端笔记知识点整合之JQuery(一)加载函数的区别操作HTML/CSS选择器

一、jQuery简介 1.0 JavaScript编程比较恶心的地方

恶心1:选择元素麻烦,全线兼容的方法只有getElementById()getElementsByTagName()两个。其他的方法是不都兼容的。getElementsByClassName()通过类名选择元素,IE9开始兼容。

恶心2:样式操作麻烦,得到原生样式,需要我们自己造轮子getStyle()

恶心3:动画麻烦,需要我们自己造轮子animate();

恶心4:批量控制麻烦,大量出现的for循环语句;排他操作麻烦

恶心5HTML节点操作麻烦

恶心的东西,能用“轮子”来解决,事实上我们已经造了两个轮子:getStyleanimate

能不能把所有轮子组合起来,成为一个框架呢?jQuery就是这样的一个东西。

 

 

1.1 简介

jQueryDOM编程领域的霸主,极大的简化了原生JavaScriptDOM编程。是免费开源的、语法设计简单,可以更便捷开发,例如选择元素、制作动画效果等功能。

jQuery中含有丰富的轮子,完美解决了选择元素难、样式难、动画难、批量操作难等各种兼容问题,让工程师只需要思考业务,而不必思考细枝末节的兼容问题。jQuery是一个js文件,兼容多浏览器的JavaScript库(框架)。

优点:使用简单方便

宗旨:Write Less, Do More.  写的少,做的多

 

 

1.2 为什么要学习jQuery

jquery开发简单、易懂、兼容性好(几乎解决了所有的兼容性问题)。

 

1.3 JavaScriptjQuery的关系

JavaScriptjQuery的关系好比父子,JavaScript是父亲,jquery是儿子(青出于蓝)

 

 

1.4 jQuery版本

前端笔记知识点整合之JQuery(一)加载函数的区别操作HTML/CSS选择器

 带有.min标识是经过压缩js文件,但是代码和没压缩的一样,不用担心,项目中都用.min的,因为文件体积小。如要查看源代码,就用没压缩的。

 

 

在官网下载的有3种版本:

 1.x 兼容所有的浏览器,PC端开发都用这个

 2.x 不兼容IE678的,一般用于移动端

 3.x 是最新的版本,不兼容IE678,一般用在移动端

 

 

下载的时候有两个选择:

前端笔记知识点整合之JQuery(一)加载函数的区别操作HTML/CSS选择器

所有jQuery版本下载地址:

1.5 jQuery使用

1、先引入jQuery文件包(外部JS文件)

 

前端笔记知识点整合之JQuery(一)加载函数的区别操作HTML/CSS选择器

1、换行在写script标签,在里面写js代码

2、使用$()方法用什么就选择什么,不用去写繁琐的获取元素的JS代码。例如:$('div')

 

$()函数是jQuery核心函数,query是选择的意思,也就是说jQuery的核心招牌动作就是选择元素:

 $('.box ul li').hide(1500);

 

 

语法:

 $('选择器');   

 

注意:

1、选择的就是符合条件的元素,而不是一个

2、$('选择器')里面的选择器和CSS选择器完全一致

$也可以用jQuery代替,它们是同一个函数。

 $('选择器');

 

等价于:

 jQuery('选择器');   

 

 

二、加载函数的区别 2.1 JavaScript入口函数

语法:

window.onload = function(){ }

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wsfsgs.html