一.$ 符号
1 将“$”定义为变量,运行如下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery入口函数与js的不同</title>
<script src="js/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function () {
var $="我是$";
$("#bt").click(function () {
//alert("我是$");
})
})
</script>
</head>
<body>
<input type="button" value="按钮" id="bt">
</body>
</html>
运行结果:
2 将代码修改如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery入口函数与js的不同</title>
<script src="js/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function () {
//var $="我是$";
$("#bt").click(function () {
alert("我是$");
})
})
</script>
</head>
<body>
<input type="button" value="按钮" id="bt">
</body>
</html>
运行结果:
由上操作对比可知,$符号在jQuery中只是一个定义好的操作符,是不需要我们自己去定义的。
二 jQuery入口函数的模拟实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery入口函数与js的不同</title>
<script src="js/jquery-1.11.1.min.js"></script>
<script>
var iQurey= function (dom) {
var obj={
ready:function (func) {
// 判断一下 docuemnt.onload 有没有被赋值(或者说有没有这个事件)
// 1.有:接收一个旧的函数,然后呢,我先去调用新的函数,接着再调用旧的函数
// 2.没有:直接赋值个onload事件
if(typeof dom.onload ==="function" ){
var oldFunc=dom.onload;
dom.onload=function () {
//调用新的函数
func();
//调用旧的函数
oldFunc();
}
}else{
dom.onload=func;
}
}
};
return obj;
};
iQurey(window).ready(function () {
alert("第一调用");
});
iQurey(window).ready(function () {
alert("第二调用");
});
var obj = {
ready: function () {
}
};
var obj1 = new Object();
obj1.ready = function () {
};
</script>
</head>
<body>
<input type="button" value="按钮" id="bt">
</body>
</html>
运行结果:
三 js入口函数跟jQuery入口函数的区别
1 js的window.onload事件是等到所有内容,以及我们的外部图片之类的文件加载完之后,才回去执行
2 jQuery的入口函数是在html所有标签都加载完之后,就回去执行
四 js创建对象的三种方式
1 var obj = { }
2 var obj1 = new Object();
3 var obj2 = Object.create();
//方法一
var obj ={
ready: function () {
}
};
//方法二
var obj1 = new Object();
obj1.ready() = function () {
};
方法一和二的区别:
推荐使用方法一。第二种方法存在效率问题,因为要new对象,会涉及原型查找问题。