jquery基础笔记

---

一、jQuery基础

首先我们应该认识到什么是jQuery，在网上，对于jQuery有以下定义：
1、jQuery 是一个 JavaScript 函数库。
2、jQuery 是一个轻量级的"写的少，做的多"的 JavaScript 库
jQuery简介：
jQuery是一个快速、简洁的JavaScript框架，它封装了JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互等
从上面的简介我们可以看出，jquery是一个帮助我们进行开发的工具，在使用时能够给我们提供更高效的代码。
除了以上特点之外，jquery还有一个功能就是不用下载而可以通过引入直接进行使用

//jquery引用代码
<script type="text/javascript" src="js/jquery.js"></script>

jquery对象

jquery对象就是通过使用jquery从而赋值给一个变量就是jquery对象。

//jquery对象
var $jq = $('input');

jQuery对象和js对象的转换
jQuery对象可以使用jQuery的附加功能，在操作时更加方便
jQuery对象与js对象方法不通用
但两者可以相互转换

JS对象 转 JQ对象：$(js对象)
JQ对象 转 JS对象： jq对象[索引]或jq对象.get(索引)

var t1 = document.getElementById('t1'); //JS对象
var $jq = $('input'); //jquery对象
//JS对象--JQ对象:$(t1)
//JQ对象--JS对象:$jq[0]或者$jq.get(0)

jquery入口函数

jquery有入口函数：$(document).ready(函数名/匿名函数)
jQuery 所有函数都位于一个 document ready 函数中，为什么会有这个入口函数呢，这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码，即在 DOM 加载完成后才可以对 DOM 进行操作，比如以下操作：
1、试图隐藏一个不存在的元素
2、获得未完全加载的图像的大小
如果你细心一点就可能会发现，jquery和window.onload有一些相似之处：

那就是两者都是需要在网页页面加载完成之后才会执行

但他们也有区别：
window.onload 只能绑定一个函数，且必须等待网页中所有内容加载完毕
而(document).ready() 可以绑定多个函数，当DOM结构加载完毕就执行

二、jQuery基本使用

1、jQuery 使用 CSS 选择器来选取 HTML 元素

1. $(‘CSS选择表达式’)
2. 表达式需加引号
3. 返回的是单个元素或元素组

2、jQuery 基本方法text()、html()、val()、attr()

1. 对应innerText、innerHTML、value
2. 获取：括号内不加参数
3. 修改：括号内加参数
4. 若jQuery对象为元素组，则修改该对象对所有元素
5. attr()的作用是获取或修改元素属性

jquery还可以进行基本事件绑定

<input type="button" id="t1" value="添加" />
	<script type="text/javascript">
		var $jq = $('#t1').click(show)
		function show(){
			alert("hello world")
		}
</script>

三、jquery选择器

基础选择器：

*	$("*")	所有元素
#id	$("#lastname")	id=“lastname” 的元素
.class	$(".intro")	所有 class=“intro” 的元素
element	$(“p”)	所有 p标签元素
.class.class	$(".intro.demo")	所有 class=“intro” 且 class=“demo” 的元素
s1,s2,s3	$(“th,td,.intro”)	所有标签为th、td以及class=“intro” 的元素