jQuery极速学习_封装,使用以及事件绑定

jquery:

 1.介绍
	jquery是js的一个框架
	封装了底层js
2.特点
	轻量级:
		文件大小较小
		argularjs(重量级框架)
	强大的选择器
		document.getElementsByTagName()
		类似css,并进行了扩展
		$("#one")
	出色的dom封装和可靠的事件处理机制:
		大部分jquery的方法返回值均为jquery对象
		ie8:
			attachEvent
	不污染顶级变量
		浏览器:
			window
				var a=10;
		linux:
			global
		html:
			var version='1.0';
	完善的ajax:
		getData(url,handler)
		getData("http://",function(){
		});
	链式操作方式:
		Array.prototype.slice.call(lis).forEach()

		function say(){
			return "hello"
		}
		say().forEach();
		$(".one").each();
	出色的浏览器兼容性
		dom
		bom
3.安装/使用
	1.cdn
		http://....
	2.下载
		在页面引入
		jQuery:
			构造函数/对象
			jQuery.prototype
				xxx
4.jquery函数的调用及参数
官方api:www.jquery123.com
div[class='one']
	1.参数为选择器
	字符串类型-》选择器
		jQuery("#one");
			返回值为类数组对象:jquery类型
	jQuery("div[class='one']");
		简写:
			jQuery->$
		$("#one")
		$("div[class='one']")
	2.参数为dom对象
		dom->jQuery(dom)		将dom转换为jquery对象

		jquery->dom
			jquery[index]
	3.参数为html文本字符串
		$("<p>hello</p>")
			1.创建dom对象
			2.将dom对象转换为jquery对象		
	4.匿名函数
		$(function(){})
			当文档结构加载完毕后再执行函数
			效率更高
		-->
		window.onload:
			当文档加载完毕之后再执行函数			
5.选择器
	类似css中选择器
	扩展
6.事件绑定
	bind("type",handler)
	unbind("type",handler)

	on("type",[selector],handler)
	off("type",[],handler);

	简写:
		以事件类型作为函数名称
		click(function(){
			if(){}
		});
		submit(function(){});
	one():只绑定事件一次
	trigger():模拟执行

7.dom操作
	a.append(b):
		将b追加给a的内容末尾
	a.appendTo(b):
		将a追加给b之后
8.属性方法
9.静态方法
	数组及对象操作:each、map、toArray、merge:
		each->forEach()
		map->map
		toArray():转换为array类型
		merge:将数组合并

	测试操作:type、isEmptyObject、isPlainObject、isNumeric
	字符串操作:param、trim、parseJSON
	isEmptyObject: 判断参数是否为空对象
	isPlainObject:
		判断参数是否为纯对象
	isNumeric:
		判断参数是否为number值
			number/“number”-》true

	param(obj)
	parseJSON(str)
10.动画		
11.ajax
	http://47.106.244.1:8099/manager/category/findAllCategory

========================

1.作用
js框架
封装底层js
2.特点
轻量级
强大的选择器:css-》扩展
	:empty
dom封装:$(dom)
可靠的事件处理机制
链式操作
	jquery实例对象-》jquery.prototype
	$("div").css().each()
不污染顶级变量
	window/global
	script:
		jQuery();
		console.log(jQuery);
封装ajax
。。。
3.使用
1.cdn
2.下载
	<script src></script>
4.参数
jQuery()
	xxxx
jQuery.prototype:
	xxxx
	$-->jQuery
1.选择器
	$("div"):
		jquery实例对象
2.dom对象
	$(dom):将dom对象转换为jquery对象
	jquery-》dom:
		jquery[index]
		for(){}
3.html类型的字符串
	$("<p><span></span></p>")
	1.创建dom
	2.将dom转换为jquery
4.匿名函数
	$(function(){}):
		当文档结构加载完毕之后再执行函数
	->
	window.onload:在文档全部加载完毕之后再执行函数
5.	api
区分:
	1.对象dom/jquery?			
	2.方法/属性 是dom/jquery?
addClass
dom:input.value;
jquery:$('input').val();
$('div'):{1,2,3,4}
	get:index=0
	set/each:
		$("div").each()
				.css()
key
key=key
key=''
key=true
function getData(url,handler){
	//1.
	//2.
	//3.
	//4.
	//5.
		if(4 && 200){
			data
			handler(data)
		}else{
			alert("");
		}
}
getData("",function(data){
	console.log(data);
});

load:
	jquery
		jquery.js
	load.html
		首页.html
		student.html
		teacher.html
contentType: "application/json; charset=utf-8"
"Authorization"
<input type="text">
jquery:$("input").val();
dom:input.value;
0.load()
1.请求token
$.ajax()
2.请求用户数据
$.ajax(
	headers:{}
	success:function(data){
		tr->tbody
	}
);
3.删除
token
1.获取id
2.发送删除请求
3.刷新页面
	清空表格
	重新请求所有数据-》新数据插入到表格中
分页:
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值