jQuery是什么?
jQuery是一个快速,小巧,功能丰富的JavaScript库。它通过易于使用的API在大量浏览器中运行,使得HTML文档遍历和操作,事件处理,动画和Ajax更加简单。通过多功能性和可扩展性的结合,jQuery改变了数百万人编写JavaScript的方式,封装好了的js的函数库。
Javascipt跟jQuery的区别:
Javascript是一门编程语言,我们用它来编写客户端浏览器脚本。
jQuery是javascript的一个库,包含多个可重用的函数,用来辅助我们简化javascript开发。
jQuery能做的javascipt都能做到,而javascript能做的事情,jQuery不一定能做到。
jQuery-1.11.3js 开发版:编写代码的时候可能会出现一些问题,去看源码的设计思路,只是参考
jquery-1.11.3.min.js 生产版:当编码完成,测试通过,上线时更换此版本
二者的内容,功能都是相同的,只是大小的问题,带min的是经过压缩以后的,去掉了所有的空格和换行,主要是减小占用的空间,形参进行了更改
语法
jQuery(document).read(function(){ });
$(function(){ });// **
window.onlaod = function(){}
$ === jQuery // $是jQuery全局函数的别名。
console.log($)
$() //传递不同的参数返回不同的值
jQuery和DOM对象的区分:
jQuery对象必须用jQuery的方法,dom对象必须用操作dom的方法,两个不能混写
<head> <meta charset="UTF-8"> <title></title> <script src="jquery-1.11.3.js"></script> </head> <body> <input type="text" class="username" value="请输入用户名" /> <script type="text/javascript"> var username = document.getElementsByClassName("username")[0]; console.log(username) //输出的是一个DOM对象 username.style.backgroundColor = "#f00"; var $username = $(".username"); console.log($username) //输出的是jquery对象,是类数组。 // 不管你用什么方式获取过来的全都是类数组,jquery操作也是操作这个类数组 $username.css("color","#fff") // jquery对象必须用jquery的方法 // dom对象必须用操作dom的方法 // 两个不能混写 </script> </body> </html>
jQuery选择器
-
ID选择器(js一般尽量用ID选择器,效率最高)(重点)
$("#id").html();
-
类选择器(重点)
$(".className").text();
-
标签选择器(重点)
$('p').click();
-
属性选择器
$("li[id]")、 $("li[id='link']").fadeIn();
-
层级选择器(重点)
$("li .link").show();
-
父子选择器
$("ul > li")
-
伪类选择器
$("p:first")
$("ul li:eq(3)")
-
表单选择器
$(":text")
$(":checkbox")
$(":checked")
详细情况可查看手册