JQuery -------- 初步

JQuery : (java Script Query),其是一个JS的框架,实质也是一个js

、优点:支持各种主流浏览器;使用比较简单,有很多丰富的插件和扩展机制

基本学习内容:

引入jQuery文件:

jQuery的选择框

jQuery的

jQuery操作元素属性

jQuery操作元素的样式和内容

jQuery操作元素的文档结合

jQuery中的事件

jQuery的动画效果

附带:jQuery的封装原理:

<html>
	<head>
		<title>jQuery封装原理</title>
		<meta charset="UTF-8"/>
		<script type="text/javascript">
			function test(){
				alert("内部显示");
			}
//			function test1(){
//				var a=getClannad();  //获取了其外部的对象
//				a.test();            //利用对象的属性进行调用
//			}
			function testTop(){
				
				function test1(){ 
					alert("双重的函---闭包")
				 }
				return test1;
			}
		</script>
		<!--涉及到变量的覆盖问题,当同名变量出现再次赋值的时候会出现新值把就值覆盖的现象,变量的原则是就近原则-->
		<!--覆盖现象是出现在变量是全局变量,对应的全局变量只能有一个,所以会出现覆盖现象-->
		<script src="jQuery附件.js" type="text/javascript" charset="utf-8"></script> 
	</head>
	<body>
		<h3>jQuery封装原理</h3>
		<input type="button" name="" id="" value="测试1" onclick="test()"/>
		<!--通过外部引用的对象进行调用,我们需要获得其外部的对象名,也会产生覆盖,毕竟是全局变量-->
		<input type="button" name="" id="" value="测试2" onclick="clannad.test()"/>
		<!--我们通过函数获得外部的函数获得对象再利用其内部的函数来进行调用,不仅有了局部变量的不会覆盖而且也可以接收变量,但是其还是一个函数还是会重名-->
		<input type="button" name="" id="" value="测试3" onclick="test1()"/>
		<input type="button" name="" id="" value="测试4" onclick="testTop()()"/>
		<!--调用testTop只能获得test1的对象,但是其并不会执行alert,这是test1执行产生的结果,所以要加两个()()-->
		<input type="button" name="" id="" value="测试5" onclick="window。test()"/>
	</body>
</html>
//function test(){
//	alert("我是外部引用");
//}

//声明对象
//var clannad={};
//clannad.test=function(){
//	alert("我是通过对象进行的外部调用");
//}
//
利用函数返回含有一定元素的对象,工厂模式
//function getClannad(){
//	var clannad={};
//	clannad.test=function(){
//		alert("我是通过函数返回对象来进行的外部调用");
//	}
//	return clannad;    //当调用这个函数时,我们可以在js中用一个变量来接受变量,来达到保留其内部变量值的目的,而且函数调用完后其内部量就消失(局部变量)
//}

匿名自调用
//(function (){     //直接去掉函数名就不会产生重名覆盖的现象了,但是我们没法调用了
//	var clannad={};
//	clannad.test=function(){
//		alert("外部的匿名自调用");
//	}
//	alert("硬性匿名自调用");
//	return clannad;    
//})()     //相当于一个函数直接调用了(定义并且执行)//所以这就会出现代码执行时就会执行(执行不受控制),而且只能调用一次

//使函数附属于一个对象
(function (obj){    //obj是形参
	obj.test=function(){     //页面加载的时候调用了
		alert("外部闭包调用");
	}
	alert("闭包调用");  
})(window)       //把整个函数封装进window对象,window是实参   

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值