Jquery(2)-基础核心

最新推荐文章于 2024-08-31 09:41:33 发布

msirene

最新推荐文章于 2024-08-31 09:41:33 发布

阅读量91

点赞数

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>jquey002.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
    <!-- <script type="text/javascript" src="js/jquery-2.1.0.js"></script> -->
    <script type="text/javascript" src="js002/demo.js"></script>
  </head>
  
  <body>
    <div id="box">基础核心</div>
  </body>
</html>

$(function () {
	
	$('#box').css('color', 'red');

});

jQuery(function () {
	
	jQuery('#box').css('color', 'red');
	
});

alert($ === jQuery);  //相等、恒等

$().css('color', 'red');


$(function () {
	//alert($);			//jQuery对象的内部
	alert($());			//返回的jQuery对象
	alert($('#box'));	//返回的也是jQuery对象
	alert($('#box').css('color', 'red'));		//还是返回的jQuery对象
	$('#box').css('color', 'red').css('font-size', '200px').css('font-weight', 'bold');

});

window.onload = function () {
	$('#box').css('color', 'red');
};	
	
window.onload = function () {
	alert(1);
};
	
window.onload = function () {
	alert(2);
};

$(document).ready(function () {
	alert(1);	
});

$(document).ready(function () {
	alert(2);	
});
	

$(function () {
	alert(1);	
});

$(function () {
	alert(2);	
});

$(function () {
	//alert($('#box'));			//返回jQuery对象
	//alert(document.getElementById('box'));		//[object HTMLDivElement]，原生DOM对象
	
	//alert($('#box').get(0));		//[object HTMLDivElement]
	
	//alert($(document.getElementById('box')).css('color', 'red'));		//jQuery对象和DOM对象之间的互换
});
	

	/*
var $$ = jQuery;
	
$(function () {						//jQuery库在base库之前引用，那么$所有权就是base库的
	

	alert($('#box').ge(0));
	alert($$('#box').get(0));
	
	
});
*/

jQuery.noConflict();				//自行了断，把自己的$所有权剔除

var $$ = jQuery;

$(function () {						//jQuery库在base库之后引用，那么$所有权就是jQuery库的
	

	alert($('#box').ge(0));
	alert($$('#box').get(0));
	
	
});

学习要点：

1.代码风格

2.加载模式

3.对象互换

4.多个库之间的冲突

学习要点：

1.代码风格

2.加载模式

3.对象互换

4.多个库之间的冲突